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.

Creating image rollover on navbar.

View previous topic View next topic Go down

Solved Creating image rollover on navbar.

Post by blindbat1457 on August 26th 2010, 11:40 pm

Not sure how to word the title..

Anyways is there a way to make the images change when you hover them on the navbar?


Last edited by blindbat1457 on August 30th 2010, 11:17 am; edited 1 time in total

blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by blindbat1457 on August 27th 2010, 8:27 am

/bump

blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by Anime Creator on August 28th 2010, 6:47 pm

what do you mean please use more than 10 words , use details like 200 words so i can understand what you want .

Anime Creator
Forumember

Posts : 337
Reputation : 7
Language : english

http://www.narutoland.net/index.htm

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by LostLegend on August 28th 2010, 7:44 pm

@Anime Creator wrote:what do you mean please use more than 10 words , use details like 200 words so i can understand what you want .

He is basically asking if there is a way to change the image on the navigation bar when you roll your mouse over it.

LostLegend
Forumember

Posts : 922
Reputation : 22
Language : English

http://naruto-role-play-rpg.forumotion.com/

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by blindbat1457 on August 29th 2010, 9:47 am

@Anime Creator wrote:what do you mean please use more than 10 words , use details like 200 words so i can understand what you want .

I am pretty sure there are more than 10 words and I am pretty sure it is clear.

Anyways to break it down for you what I want is a roll over image on my navigation bar.

Example:
http://websitetips.com/css/tutorials/menus/

When you hover the links it changes images.

blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by Emilio on August 29th 2010, 12:13 pm

You can easily change the opacity of the navbar so they look transparant .

Emilio
Forumember

Male Posts : 496
Reputation : 17
Language : Dutch , English ( Learning French & Spanish)

http://www.graphilicious.forumotion.com

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by blindbat1457 on August 30th 2010, 11:07 am

Not what I want...

blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by blindbat1457 on August 30th 2010, 11:16 am

Thanks to Gangstar the code I was looking for is this:

Code:
#i_icon_mini_index {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_index:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}

#i_icon_mini_profile {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_profile:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}


#i_icon_mini_message {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_message:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}

#i_icon_mini_new_message {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_new_message:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}


#i_icon_mini_logout {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_logout:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}


#i_icon_mini_login {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_login:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}

#i_icon_mini_register {
background-image: url(IMAGE1);
width: 105px;
height: 135px;
}
#i_icon_mini_register:hover {
background-image: url(IMAGE2);
width: 105px;
height: 135px;
}

/solved
/locked

blindbat1457
Forumember

Male Posts : 667
Reputation : 6
Language : English
Location : Santa Clarita, CA

Back to top Go down

Solved Re: Creating image rollover on navbar.

Post by kirk on August 30th 2010, 12:26 pm

Since the thread was marked as solved i will now lock Smile

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