The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How to make the navigation bar hover

View previous topic View next topic Go down

How to make the navigation bar hover

Post by Spyro Dragon™ on 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
http://i37.servimg.com/u/f37/17/84/98/50/13735810.gif

Edit kirk:
Topic title changed.

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

Post by Karim Patron on 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

Karim Patron
Forumember

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

Back to top Go down

Re: How to make the navigation bar hover

Post by SLGray on 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.


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


SLGray
Administrator
Administrator

Male Posts : 35613
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Re: How to make the navigation bar hover

Post by Spyro Dragon™ on 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™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

BUMP

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

This is easy.

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

Ultron's Vision
Forumember

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

http://duelacademy.net

Back to top Go down

Re: How to make the navigation bar hover

Post by SLGray on 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.


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


SLGray
Administrator
Administrator

Male Posts : 35613
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Re: How to make the navigation bar hover

Post by Nera. on 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
http://i37.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. http://help.forumotion.com/t91142-hover-nav-barsrep-asap?highlight=Hover
2. http://help.forumotion.com/t91018-image-exchange-as-hover-effect-on-the-nav-bar?highlight=Hover

Etc.

Nera.
Energetic

Female Posts : 7077
Reputation : 2013
Language : English
Location : -

http://webartzforum.com

Back to top Go down

Re: How to make the navigation bar hover

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

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

www.tlos.openu2.com

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

BUMP

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

BUMP

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

BUMP

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

Post by P-Robs on 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://illiweb.com/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.

P-Robs
Forumember

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

http://hieraticskyacademy.forumotion.com/

Back to top Go down

Re: How to make the navigation bar hover

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

It still does not work..

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

BUmpity Bumpity Bumpity bumpity ity bumpitbyitiby.

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

bump

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

Post by kirk on 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.

kirk
Forumaster

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

Back to top Go down

Re: How to make the navigation bar hover

Post by Spyro Dragon™ on 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

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

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


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


SLGray
Administrator
Administrator

Male Posts : 35613
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Re: How to make the navigation bar hover

Post by Spyro Dragon™ on 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(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;
}


even though the Hovers do not work.


Optimize your CSS NO
Deactivate basic Css NO

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

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

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

P-Robs
Forumember

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

http://hieraticskyacademy.forumotion.com/

Back to top Go down

Re: How to make the navigation bar hover

Post by tommycoo on 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(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;
}


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;
}

tommycoo
Forumember

Male Posts : 615
Reputation : 9
Language : Indonesia

http://www.atlanta.forumid.net

Back to top Go down

Re: How to make the navigation bar hover

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

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

Sanket
ForumGuru

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

http://webartzforum.com

Back to top Go down

Re: How to make the navigation bar hover

Post by kirk on 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 

kirk
Forumaster

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

Back to top Go down

Re: How to make the navigation bar hover

Post by Spyro Dragon™ on 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

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Re: How to make the navigation bar hover

Post by kirk on 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:
for custom pages you mean html pages?
well if you add you header and footer to the html page then your navigation should hover the same way as on the forum.

If you are not adding the header and footer and creating a custom navigation for html pages.
then you would have to either import the css using import tags, or you can use css style tags to be added in-between <head> </head> section of your html coding.

Import css tags
Code:

<link rel="stylesheet" type="text/css" href="URL TO YOUR CSS HERE">
Internal sheet tags
Code:

<style>
YOUR CSS HERE
</style>
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 )

kirk
Forumaster

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

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum