1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Modifying the hover state of controls

Discussion in 'Styling and Customization Questions' started by psTubble27, Jan 15, 2012.

  1. psTubble27

    psTubble27 Well-Known Member

    How do we alter the hover state of message controls (e.g. "Like", "Edit"), even in times when the mouse is not over them?
     
  2. Brogan

    Brogan XenForo Moderator Staff Member

    Style Properties -> Message Elements -> Control
     
  3. psTubble27

    psTubble27 Well-Known Member

    I'm aware of that Style Properties page; however unless I'm mistaken, it modifies the control only when mouse is hovering over it. In other words, this is the control's hover state. I'm asking how I would go about modifying the hover state of other elements, which would alter the control's appearance.
     
  4. Brogan

    Brogan XenForo Moderator Staff Member

    I don't understand what you're asking.

    What I posted above is for general styling of the message controls.
    There are separate pages for the focus, hover and active states, directly below.
     
  5. psTubble27

    psTubble27 Well-Known Member

    Ok if I hover over the username, and the Controls go from invisible to visible -- how do I do that?

    I need to alter the username's hover state, am I right?
     
  6. Brogan

    Brogan XenForo Moderator Staff Member

    The username is not part of the message controls.

    I'm not sure what elements it is you're trying to change - your original post stated "How do we alter the hover state of message controls (e.g. "Like", "Edit")" but now you want the user name?

    Which elements exactly are you trying to change?
    What do you want them to do?
     
  7. psTubble27

    psTubble27 Well-Known Member

    I'd like to alter the visibility of Controls whenever I am anywhere on the post; not just when I'm over the controls themselves.
     
  8. Brogan

    Brogan XenForo Moderator Staff Member

    What do you mean by "alter the visibility"?

    My first post is the correct area to modify those elements when they are not hovered over.
     
  9. psTubble27

    psTubble27 Well-Known Member

    Sorry for the confusion :)

    I want the controls to be invisible or barely visible when in their normal state, and fully visible when the user hovers over any area of the post.
     
  10. Brogan

    Brogan XenForo Moderator Staff Member

    Aha!
    So you want the hover attribute for those elements to apply over the whole message area.
     
    R_A likes this.
  11. psTubble27

    psTubble27 Well-Known Member

    Can you point me in the right direction? :) The basic concept involved, maybe some tutorials?
     
  12. psTubble27

    psTubble27 Well-Known Member

    Interesting, now that I think about it, the RSS-feed buttons in the main forum_list behave exactly the same way, "on" only when the mouse hovers over that section of the forum.

    There's got to be a simple way to replicate that here...
     
  13. Steve F

    Steve F Well-Known Member

    Add this to your EXTRA.css template for your style. Change the opacity to what ever you want.

    Code:
    .message .messageMeta .privateControls .item, .message .messageMeta .publicControls .item
    {
        opacity: 0.1;
    }
     
    .message:hover .messageMeta .privateControls .item, .message:hover .messageMeta .publicControls .item
    {
        opacity: 1;
    }
     
    Klaudius, R_A and Brogan like this.
  14. psTubble27

    psTubble27 Well-Known Member

    Worked, that was some ninja CSS, major "like"! :)
     

Share This Page