Full version: jsB@nk » Image » Four-state of image
URL: https://www.javascriptbank.com/four-state-of-image.html
Move the mouse slowly over each image, press down the mouse button, then slowly release it. Exercise the buttons more rapidly to see the fulleffect. The image buttons have true four-statemotion. Images are linkable, of course, though we don't have them linked in this demo.
Full version: jsB@nk » Image » Four-state of image
URL: https://www.javascriptbank.com/four-state-of-image.html
<style><!--.mouseBeOffMe {border-top: 10px solid #000000; border-bottom: 10px solid #000000; border-left: 6px solid #000000; border-right: 10px solid #000000; }.mouseBeOnMe {border-top: 6px solid #000000;border-bottom: 14px solid #000000; border-left: 10px solid #000000; border-right: 6px solid #000000;}.mouseBeDown {border-top: 13px solid #000000;border-bottom: 7px solid #000000; border-left: 10px solid #000000; border-right: 6px solid #000000;}.mouseBeUp {border-top: 10px solid #000000;border-bottom: 10px solid #000000; border-left: 10px solid #000000; border-right: 6px solid #000000;}//--></style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><table border="0" cellpadding="7" cellspacing="0" bgcolor="#000000"> <tr> <td bgcolor="#000000"><img src = "logojs.gif"title = "This is the Image One Label"width = "90"height = "90"border = "0"class = "mouseBeOffMe"onmouseover = "this.className='mouseBeOnMe'"onmousedown = "this.className='mouseBeDown'"onmouseup = "this.className='mouseBeUp'"onmouseout = "this.className='mouseBeOffMe'"><img src = "photo3.jpg"title = "This is the Image Two Label"width = "90"height = "90"border = "0"class = "mouseBeOffMe"onmouseover = "this.className='mouseBeOnMe'"onmousedown = "this.className='mouseBeDown'"onmouseup = "this.className='mouseBeUp'"onmouseout = "this.className='mouseBeOffMe'"><img src = "photo2.jpg"title = "This is the Image Three Label"width = "90"height = "90"border = "0"class = "mouseBeOffMe"onmouseover = "this.className='mouseBeOnMe'"onmousedown = "this.className='mouseBeDown'"onmouseup = "this.className='mouseBeUp'"onmouseout = "this.className='mouseBeOffMe'"> </td> </tr> <tr> <td bgcolor="#141414" align="center"><font color="#EFE7DF" size="2" face="Arial">Move the mouse slowly over each image, press<br>down the mouse button, then slowly release it.<br>Exercise the buttons more rapidly to see the full<br>effect. The image buttons have true four-state<br>motion. Images are linkable, of course, though<br>we don't have them linked in this demo.</font> </td> </tr> </table><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->