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.

Navbar Rollover Image

View previous topic View next topic Go down

Solved Navbar Rollover Image

Post by Jeremjay24 on August 29th 2010, 5:22 am

I am making a theme and I want it so if you roll over the navbar buttons with your mouse, they change into a different image. What's the CSS code?

It is Phpbb2, by the way

Jeremjay24
Forumember

Posts : 155
Reputation : 0
Language : English

http://penguinwaddle.forumotion.com/

Back to top Go down

Solved Re: Navbar Rollover Image

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

I posted the same thing no reply.

blindbat1457
Forumember

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

Back to top Go down

Solved Re: Navbar Rollover Image

Post by Guest on August 29th 2010, 5:28 pm

Put this code in your css and change the IMAGE1 to normal and IMAGE2 for hover image.

and deleted your navbar images from the pics managements Smile

PS: Change the "Width" & "Height" to your image size Very Happy
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;
}


Last edited by Gangstar15 on August 30th 2010, 1:18 pm; edited 1 time in total

Guest
Guest


Back to top Go down

Solved Re: Navbar Rollover Image

Post by roCrox on August 30th 2010, 11:04 am

This was also what i was searching for, thanks Smile

roCrox
Forumember

Male Posts : 83
Reputation : 20
Language : English

Back to top Go down

Solved Re: Navbar Rollover Image

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

Sigh I swear people hate me on here lol.
I always get my answers weeks after lame sauce.

Anyways phpbb2?

I will try to go look at the code and do it on my own but I might need it in PHPbb2

blindbat1457
Forumember

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

Back to top Go down

Solved Re: Navbar Rollover Image

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

Okay never mind think it is the same code.

blindbat1457
Forumember

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

Back to top Go down

Solved Re: Navbar Rollover Image

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

yup same one.
nice job gangstar Smile

we'll wait for Jeremjay24 to get the code and make sure he has it and understands it right .. Smile Smile Smile

kirk
Forumaster

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

Back to top Go down

Solved Re: Navbar Rollover Image

Post by Jeremjay24 on August 31st 2010, 3:26 am

Thanks, it works Smile

Jeremjay24
Forumember

Posts : 155
Reputation : 0
Language : English

http://penguinwaddle.forumotion.com/

Back to top Go down

Solved Re: Navbar Rollover Image

Post by Sanket on August 31st 2010, 8:42 am

Since this thread is marked solved, I will lock this thread.


Sanket Smile


Sanket
ForumGuru

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

http://webartzforum.com

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