Tiny image to big image on hover? |
Tiny image to big image on hover? |
![]()
Post
#1
|
|
![]() Senior Member ![]() ![]() ![]() Group: Member Posts: 33 Joined: Sep 2005 Member No: 224,772 ![]() |
I've been looking for a code so that when you hover over a small image (like a thumbnail) it shows it large.
Thanks in advance! |
|
|
![]() |
![]()
Post
#2
|
|
![]() Senior Member ![]() ![]() ![]() ![]() Group: Member Posts: 253 Joined: Jul 2009 Member No: 739,898 ![]() |
CODE .UPandUP{position: relative;} .thumbnail{position: relative;} .thumbnail:hover{background-color: transparent; } .thumbnail span{ position: absolute; background-color: transparent; background-position:top left; width: 0px; padding: 0px; border: 0px; visibility: hidden; color: black; text-decoration: none; top: -450; left: -270px; } .thumbnail span img{ border-width: 0; padding: 0px; } .thumbnail:hover span{visibility: visible; top: -500; left: -170px; z-index: 9;} a.clickherexx{ display:block; background-position:top left; height:42px; width:450px; float: left; background-image:url(http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/clickhere.png); } a.clickherexx:hover {background-position: top right;} div.desktops a:hover{ border-top: none; opacity: 0.0; filter: alpha(opacity=0); width: 0px; height: 0px; z-index:1;} CODE <div class="UPandUP"> <a class="thumbnail" href="http://www.msplinks.com/MDFodHRwOi8vYmFuZG1lcmNoLnNlZW5vbi5jb20vaW5kZXgucGhwP3Y9YXVndXN0YnVybnNyZWQ="><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/dogSM.png" border="0" /><span><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/dogBG.png" /></span></a><a class="thumbnail" href="http://www.msplinks.com/MDFodHRwOi8vYmFuZG1lcmNoLnNlZW5vbi5jb20vZGV0YWlsLnBocD9wPTc0MDM4JnY9YXVndXN0YnVy nNyZWR0"><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/perchSM.png" border="0" /><span><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/perchBG.png" /></span></a><a class="thumbnail" href="http://www.msplinks.com/MDFodHRwOi8vYmFuZG1lcmNoLnNlZW5vbi5jb20vZGV0YWlsLnBocD9wPTYyNDA3JnY9YXVndXN0YnVy nNyZWQ="><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/samSM.png" border="0" /><span><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/samBG.png" /></span></a></div> <br /> <a class="thumbnail" href="http://www.msplinks.com/MDFodHRwOi8vYmFuZG1lcmNoLnNlZW5vbi5jb20vZGV0YWlsLnBocD9wPTg0NjM4JnY9YXVndXN0YnVy nNyZWQ="><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/clawSM.png" border="0" /><span><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/clawBG.png" /></span></a><a class="thumbnail" href="http://www.msplinks.com/MDFodHRwOi8vYmFuZG1lcmNoLnNlZW5vbi5jb20vZGV0YWlsLnBocD9wPTc0MDM3JnY9YXVndXN0YnVy nNyZWQ="><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/wolfSM.png" border="0" /><span><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/wolfBG.png" /></span></a><a class="thumbnail" href="http://www.msplinks.com/MDFodHRwOi8vYmFuZG1lcmNoLnNlZW5vbi5jb20vZGV0YWlsLnBocD9wPTYwODgzJnY9YXVndXN0YnVy nNyZWQ="><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/saberSM.png" border="0" /><span><img src="http://www.solidstaterecords.com/augustburnsred/guardianMyspace/images/store/saberBG.png" /></span></a></div> </td></tr> Probably cbf. Ahaha. |
|
|
![]() ![]() |