Jump to content

Make a thumbnail bigger while mouse hover


10eIOSweb

Recommended Posts

CSS3 has great way to do it. It's called transition. Here is a example how it would look:

 img {			transition:width 1s;			-moz-transition:width 1s;			-webkit-transition:width 1s;			-o-transition:width 1s;} img:hover {   width: 100%;}

Just remember! transition: [goal] [time]; Goal can be anything in CSS,background-color,color,height,float....etc. Time is in seconds! And the goal can't be in same CSS element,it must be in :after,:hover..etc.

Link to comment
Share on other sites

Oh yeah,forgot to add that you can add multiple values.

img {					    transition:width 1s,height 1s;					    -moz-transition:width 1s,height 1s;					    -webkit-transition:width 1s,height 1s;					    -o-transition:width 1s,height 1s;}img:hover {   width: 100%;   height: 100%;}

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...