Image rollovers. [SOLVED]

Web design related discussion or help, including CSS.

Image rollovers.

Postby Benjamin » Sat Jul 24, 2010 6:24 pm

Hello guys

I was having a look at this site off a google ad and just kept browsing and found this mock up template.
http://www.templateaccess.com/demos/log ... index.html

When you try to use the naviagte bar you'll see that on hover there is a dark grey rounded edge box behinf the text, just wondered if this was CSS image rollovers would people guess? Or if not, what would peoples ideas be? I'm trying to get better at CSS

8-)
Thanks to anyone who helps me out!
Feel free to point out any errors or improvements in any of my code
:)
Benjamin
 
Posts: 51
Joined: Tue Nov 17, 2009 6:42 pm
Online: 1h 27m 45s
Karma: 0

Re: Image rollovers.

Advertisment

Advertisment
 

Re: Image rollovers.

Postby Tino » Sat Jul 24, 2010 6:40 pm

Considering that template uses jQuery, it wouldn't surprise me if that navigation would be done using jQuery as well.

But it can be done with normal JavaScript or CSS as well.
The below statement is false.
The above statement is true.

CodeCanyon
There are some pretty cool items over here, you should check them out.

There are 10 kinds of people, those who understand binary, and those who do not.
User avatar
Tino
Moderator
 
Posts: 1060
Joined: Wed Apr 22, 2009 1:28 pm
Location: The Netherlands
Online: 5d 13h 42m 14s
Karma: 10

Re: Image rollovers.

Postby Benjamin » Sat Jul 24, 2010 6:48 pm

Thanks Tino,

Would it just be preloading the images and swapping them on hover?
Thanks to anyone who helps me out!
Feel free to point out any errors or improvements in any of my code
:)
Benjamin
 
Posts: 51
Joined: Tue Nov 17, 2009 6:42 pm
Online: 1h 27m 45s
Karma: 0

Re: Image rollovers.  [SOLVED]

Postby Tino » Sat Jul 24, 2010 6:58 pm

Depends on what technology you want to use ;)

But the idea is right, yes. Load the images, but do not display them. Then, when it's hovered over, display them, and let them disappear when the mouse gets taken off of them.
The below statement is false.
The above statement is true.

CodeCanyon
There are some pretty cool items over here, you should check them out.

There are 10 kinds of people, those who understand binary, and those who do not.
User avatar
Tino
Moderator
 
Posts: 1060
Joined: Wed Apr 22, 2009 1:28 pm
Location: The Netherlands
Online: 5d 13h 42m 14s
Karma: 10

Re: Image rollovers.

Postby Benjamin » Sat Jul 24, 2010 7:24 pm

Thanks Tino :)
Thanks to anyone who helps me out!
Feel free to point out any errors or improvements in any of my code
:)
Benjamin
 
Posts: 51
Joined: Tue Nov 17, 2009 6:42 pm
Online: 1h 27m 45s
Karma: 0

Re: Image rollovers.

Postby libeco » Sat Jul 24, 2010 8:13 pm

Just to add on this concept: those images are usually called sprites... ;)
Common PHP/MySQL errors | How to display code on the forum
"It always seems impossible until its done." - Nelson Mandela
User avatar
libeco
Moderator
 
Posts: 2456
Joined: Fri Apr 24, 2009 9:03 pm
Location: Netherlands
Online: 5d 7h 42m 55s
Karma: 25


Return to Web Design

Who's online?

Users browsing this forum: No registered users and 1 guest