How to make the navigation bar hover Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
+5
Nera.
Ultron's Vision
SLGray
Karim Patron
Spyro Dragon™
9 posters

    How to make the navigation bar hover

    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty How to make the navigation bar hover

    Post by Spyro Dragon™ July 12th 2013, 1:21 am

    Tried looking all over this Freaking forum and couldent find it, so you guys are literly Forcing me to make anohter FREAKING topic about it.

    www.tlos.openu2.com
    When you Hover over the HOME button  or anyother button
    When you hover over one of them how do you make the picture change
    say to like this
    https://i.servimg.com/u/f37/17/84/98/50/13735810.gif

    Edit kirk:
    Topic title changed.
    Karim Patron
    Karim Patron
    Forumember


    Posts : 55
    Reputation : 4
    Language : English, French, Arabic

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Karim Patron July 12th 2013, 2:13 am

    if i correctly understand what you mean, you want the picture of "Home" changes when the cursor is on it ?

    if YES ...
    you know, i really want to add that feature, but how ?

    can someone help us ?
     

    if NO ...
    Explain again, i can maybe help you
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51553
    Reputation : 3519
    Language : English
    Location : United States

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by SLGray July 12th 2013, 2:23 am

    Please try to stay calm. We all are here to offer support. Please do not use all caps as it is considered yelling.



    How to make the navigation bar hover Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 12th 2013, 4:50 am

    I Know thers a way to do it, because iv done it before, and i lost the code..

    Now i ask for the code again...
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 12th 2013, 8:44 am

    BUMP
    Ultron's Vision
    Ultron's Vision
    Forumember


    Male Posts : 634
    Reputation : 45
    Language : English | German | HTML | JavaScript | PHP | C++ | Perl | Java
    Location : Vienna, Austria

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Ultron's Vision July 12th 2013, 12:02 pm

    This is easy.

    Tell me which buttons you want to replace and I'll have it done soon.
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51553
    Reputation : 3519
    Language : English
    Location : United States

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by SLGray July 12th 2013, 6:25 pm

    Spyro Dragon™ wrote:I Know thers a way to do it, because iv done it before, and i lost the code..

    Now i ask for the code again...

    Spyro Dragon™ wrote:BUMP
    Please don't double/triple post. Your post need to be separated by 24 hours before bumping, replying or adding more information. Please use the edit button instead!

    Since this is your fourth time, you have received a serious warning.



    How to make the navigation bar hover Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Nera.
    Nera.
    Energetic


    Female Posts : 7078
    Reputation : 2017
    Language : English
    Location : -

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Nera. July 12th 2013, 9:18 pm

    Spyro Dragon™ wrote:Tried looking all over this Freaking forum and couldent find it, so you guys are literly Forcing me to make anohter FREAKING topic about it.

    www.tlos.openu2.com
    When you Hover over the HOME button  or anyother button
    When you hover over one of them how do you make the picture change
    say to like this
    https://i.servimg.com/u/f37/17/84/98/50/13735810.gif

    Karim Patron wrote:if i correctly understand what you mean, you want the picture of "Home" changes when the cursor is on it ?

    if YES ...
    you know, i really want to add that feature, but how ?

    can someone help us ?
     

    if NO ...
    Explain again, i can maybe help you


    Hi,

    All solved.

    1. https://help.forumotion.com/t91142-hover-nav-barsrep-asap?highlight=Hover
    2. https://help.forumotion.com/t91018-image-exchange-as-hover-effect-on-the-nav-bar?highlight=Hover

    Etc.
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 13th 2013, 12:33 am

    Okay i put those codes in, but it still will not change..

    www.tlos.openu2.com
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 14th 2013, 4:52 am

    BUMP
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 15th 2013, 2:02 am

    BUMP
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 21st 2013, 7:56 am

    BUMP
    P-Robs
    P-Robs
    Forumember


    Male Posts : 40
    Reputation : 3
    Language : English
    Location : United States

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by P-Robs July 22nd 2013, 3:20 am

    Spyro Dragon™ wrote:Okay i put those codes in, but it still will not change..

    www.tlos.openu2.com

    Did you remove the image urls from the pics management??? ACP >> Display >> Pics Management >> Advanced

    Following this tutorial, ensure that the fields for the navbar contain the following:
    Code:
    http://2img.net/i/fa/empty.gif

    If there are urls other than this, simply delete what is there and save. The system will automatically place the given link in those fields.

    If you placed the codes for your hovering navbar in the CSS correctly, then it should be functioning correctly.
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 24th 2013, 1:49 pm

    It still does not work..
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 26th 2013, 4:34 am

    BUmpity Bumpity Bumpity bumpity ity bumpitbyitiby.
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 26th 2013, 8:49 am

    bump
    kirk
    kirk
    Forumaster


    Male Posts : 11037
    Reputation : 653
    Language : English,Vulcan,Klingon, Romulan,& Gorn

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by kirk July 26th 2013, 7:31 pm

    Spyro Dragon™ wrote:Okay i put those codes in, but it still will not change..

    www.tlos.openu2.com

     you put what codes in where?
    I see two different links above, and there are a lot of ways of doing hover.
    please explain in as much details as you can, post any screen shits, codes or links to better help us understand as well.

    Thank you.
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 27th 2013, 8:05 am

    Okay, But you can you correct your spelling and make it
    Screen Shots, instead of what you have on there,  I have ppb2, The codes that they gave me worked b4 but Idk whats stopping it from working now, My site is tlos.openu2.com
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51553
    Reputation : 3519
    Language : English
    Location : United States

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by SLGray July 27th 2013, 5:09 pm

    Did you add any codes right before this issue appeared? It could be that some codes are conflicting.



    How to make the navigation bar hover Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ July 29th 2013, 12:59 am

    This is currently my whole style sheet
    body, a:hover {cursor: url(http://www.fileden.com/files/2012/8/20/3339125/CURSOR2.cur), progress !important;}

    .gensmall {
    font-size : 10px;
    display: none
    }

    #i_icon_mini_index {
    background-image: url(https://2img.net/h/i1355.photobucket.com/albums/q705/SpyroDragon-/home10101_zpsebed84fb.gif);
    width: XYpx;
    height: XYpx;
    }

    #i_icon_mini_index:hover {
    background-image: url(https://2img.net/h/i1355.photobucket.com/albums/q705/SpyroDragon-/137358142878080_zpsb9a4a034.gif);
    width: XYpx;
    height: XYpx;
    }


    even though the Hovers do not work.


    Optimize your CSS NO
    Deactivate basic Css NO
    P-Robs
    P-Robs
    Forumember


    Male Posts : 40
    Reputation : 3
    Language : English
    Location : United States

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by P-Robs July 29th 2013, 1:15 am

    You should definitely change this option:: 'Optimize your CSS: YES'. That's part of the problem.
    tommycoo
    tommycoo
    Forumember


    Male Posts : 615
    Reputation : 9
    Language : Indonesia

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by tommycoo July 29th 2013, 1:23 am

    Spyro Dragon™ wrote:This is currently my whole style sheet
    body, a:hover {cursor: url(http://www.fileden.com/files/2012/8/20/3339125/CURSOR2.cur), progress !important;}

    .gensmall {
    font-size : 10px;
    display: none
    }

    #i_icon_mini_index {
    background-image: url(https://2img.net/h/i1355.photobucket.com/albums/q705/SpyroDragon-/home10101_zpsebed84fb.gif);
    width: XYpx;
    height: XYpx;
    }

    #i_icon_mini_index:hover {
    background-image: url(https://2img.net/h/i1355.photobucket.com/albums/q705/SpyroDragon-/137358142878080_zpsb9a4a034.gif);
    width: XYpx;
    height: XYpx;
    }


    even though the Hovers do not work.


    Optimize your CSS NO
    Deactivate basic Css NO

    you have to fill width and height of that image too

    here is replace this code

    Code:
    #i_icon_mini_index {
    background-image: url(http://i1355.photobucket.com/albums/q705/SpyroDragon-/home10101_zpsebed84fb.gif);
    width: XYpx;
    height: XYpx;
    }

    #i_icon_mini_index:hover {
    background-image: url(http://i1355.photobucket.com/albums/q705/SpyroDragon-/137358142878080_zpsb9a4a034.gif);
    width: XYpx;
    height: XYpx;
    }

    to this

    Code:
    #i_icon_mini_index {
    background-image: url(http://i1355.photobucket.com/albums/q705/SpyroDragon-/home10101_zpsebed84fb.gif);
    width: 187px;
    height: 133px;
    }

    #i_icon_mini_index:hover {
    background-image: url(http://i1355.photobucket.com/albums/q705/SpyroDragon-/137358142878080_zpsb9a4a034.gif);
    width: 187px;
    height: 133px;
    }
    Sanket
    Sanket
    ForumGuru


    Male Posts : 48766
    Reputation : 2830
    Language : English
    Location : Mumbai

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Sanket July 29th 2013, 12:37 pm

    Please change the title of your forum & remove the unnecessary words with immediate effect.
    kirk
    kirk
    Forumaster


    Male Posts : 11037
    Reputation : 653
    Language : English,Vulcan,Klingon, Romulan,& Gorn

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by kirk July 31st 2013, 6:18 pm

    Sanket wrote:Please change the title of your forum & remove the unnecessary words with immediate effect.

    I am sick of seeing it so i will change it.

    Spyro Dragon
    This will be your only verbal warning.Anymore outburst such as this will lead to official warnings and or other actions.
    Please refrain from creating post titles in all caps and or sarcastic postings. I understand things can be frustrating but you have to remain calm and patient. We will do our best to sort your problem out as fast as possible.
    Thank You
    Wink 
    Spyro Dragon™
    Spyro Dragon™
    Forumember


    Male Posts : 202
    Reputation : 2
    Language : English

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by Spyro Dragon™ August 2nd 2013, 11:07 am

    It still does not work.. Do you mind just doing it for me? because its giving me a headach, I Turned optimize on, I even put deactivate basic css with optimize, and still didn't work, I put the codes in the Css sheet, still nothing happens....gaah, I want my stankin na'vi bar to move  when I Hover over it, is that so much to ask?!

    I made another attempt, I did what that one guy said and put thewidth and higheth , but i forgot to make the picture " empty " with pics manamgent, it works thank you guys so much for dealing with my crap!!!



     Is there a way to do it with the customized pages?

     etc:  the " Music " tab
    kirk
    kirk
    Forumaster


    Male Posts : 11037
    Reputation : 653
    Language : English,Vulcan,Klingon, Romulan,& Gorn

    How to make the navigation bar hover Empty Re: How to make the navigation bar hover

    Post by kirk August 10th 2013, 10:53 pm

    Spyro Dragon™ wrote:



     Is there a way to do it with the customized pages?

     etc:  the " Music " tab
    Spoiler:
    Info added
    Or do you mean if you add new navigation tabs leading somewhere.
    If you add new tabs the hover will work the same as the ones you have now )