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 Sun 29 Aug - 6:22

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 Sun 29 Aug - 10:40

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 Sun 29 Aug - 18:28

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 Mon 30 Aug - 14:18; edited 1 time in total

Guest
Guest


Back to top Go down

Solved Re: Navbar Rollover Image

Post by roCrox on Mon 30 Aug - 12:04

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 Mon 30 Aug - 12:08

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 Mon 30 Aug - 12:13

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 Mon 30 Aug - 13:29

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 Tue 31 Aug - 4:26

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 Tue 31 Aug - 9:42

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


Sanket Smile


Sanket
ForumGuru

Male Posts : 48766
Reputation : 2820
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