Grow your CSS skills. Land your dream job.

Menu Mouse Over Problem

  • # February 18, 2013 at 5:12 am

    Hi,

    Can you help me out with this?

    I’m having a little problem w/ the mouse over effects in my site’s menu (
    http://dasjdkjaskldjklasjdklasjkdjaskldjk.blogspot.com)

    When you’d hover your cursor over the buttons, it would just become transparent.

    It should actually be just like the menu here: http://schooluniformsprosncons.blogspot.com/

    Can you show me what I’m doing wrong, please?

    I would appreciate it very much!

    # February 18, 2013 at 5:46 am

    In your CSS, change the code to this:


    .tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
    background-position:0 -74px;
    color: transparent;
    }

    You had:


    .tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
    background: none;
    color: transparent;
    }

    Hope this helps!

    # February 18, 2013 at 5:54 am

    Hello,

    I’ve tried changing it, but there doesn’t seem to be any difference from before.

    Have you tried it on your own browser (with inspect element) and did it work?

    Thanks,
    xcadesigns

    # February 18, 2013 at 6:46 am

    I’m not seeing a bg image listed in either of those code blocks.

    # February 18, 2013 at 11:39 am

    See this Pen here: http://codepen.io/JMDUK/pen/rnlHo

    I changed added a hover state for the menu item. The background-position needs to be set as you’re using a sprite image.

    Hope this helps. :)

    # February 18, 2013 at 11:37 pm

    @ Paulie_D

    Sorry, I don’t get what you’re saying.

    Do you mean that you don’t see the menu? The big bright red menu on top of the page? or do you mean something else?

    Can you please point it out for me?

    I would appreciate it very much.

    Thanks,
    xcadesigns



    JamesMD -

    Hey, James!

    I was finally able to figure it out!

    Though I didn’t exactly use the code you provided me (the .homebtn a:hover already has a background position set to ‘left bottom’ so I didn’t need the background-position code you provided me anymore), funny thing is, whilst experimenting with the codes you provided me, I just got to thinking, ‘maybe the ‘inner-tabs’ (where ever the menu is contained now) has something to do this? I wonder if I get rid of it’

    So I did, and then that’s when the menu started working out.

    Anyway, I appreciate your efforts, most especially your strong and friendly support on this one.

    Cheers,
    xcadesigns

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".