Phiên bản đầy đủ: jsB@nk » 3D » Cài đặt trạng thái cho ảnh 1
URL: https://www.javascriptbank.com/examples-lyrobjclipbutton.html
Hiệu ứng có thể được dùng để cài đặt trạng thái cho các đối tượng như ảnh và nút...
Phiên bản đầy đủ: jsB@nk » 3D » Cài đặt trạng thái cho ảnh 1
URL: https://www.javascriptbank.com/examples-lyrobjclipbutton.html
<style type="text/css"><!--body { font-family:Georgia,Trebuchet MS,Arial,Helvetica,sans-serif; font-size:12px; color:black; background-color:white; }a:link, a:visited, a:active { color:#9E0B0E; text-decoration:none; }// --></style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><script language="JavaScript">/* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/<!--var aa,clipbutton1,cc,clipbutton2;function initOnLoad() {fixNetscape();aa = new LyrObj("lyra");clipbutton1 = new ClipButton("lyrb", 50, 50, 4);// to access the nested layers, the path is supplied// as well, in this case "parentlayer"cc = new LyrObj("lyrc", "parentlayer");clipbutton2 = new ClipButton("lyrd", 50, 50, 4, "parentlayer");// initialize the ClipButtons to state 0 -// setting the state will adjust the clipping// and the button is visible.clipbutton1.setState(0);clipbutton2.setState(0);}//--></script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><body onload="initOnLoad()"><div id="fixnetscape" style="position:absolute;visibility:hiclipbutton2en"></div><!-- THE LAYER SHOWING THE FULL CLIPBUTTON IMAGE --><div id="info2" style="position:absolute; left:400px; top:20px; width:160px; background-color:#F0F0F0; layer-background-color:#F0F0F0; padding:5px">setState of first ClipButton<br><a href="#" onmouseover="if(clipbutton1)clipbutton1.setState(0)">[ 0 ]</a> <a href="#" onmouseover="if(clipbutton1)clipbutton1.setState(1)">[ 1 ]</a> <a href="#" onmouseover="if(clipbutton1)clipbutton1.setState(2)">[ 2 ]</a> <a href="#" onmouseover="if(clipbutton1)clipbutton1.setState(3)">[ 3 ]</a><br><br>setState of second ClipButton<br><a href="#" onmouseover="if(clipbutton2)clipbutton2.setState(0)">[ 0 ]</a> <a href="#" onmouseover="if(clipbutton2)clipbutton2.setState(1)">[ 1 ]</a> <a href="#" onmouseover="if(clipbutton2)clipbutton2.setState(2)">[ 2 ]</a> <a href="#" onmouseover="if(clipbutton2)clipbutton2.setState(3)">[ 3 ]</a><br><br>This is the full image of the ClipButton:<br><br><img src="images/space.gif" width="10" height="1" alt="" border="0"><img src="images/clipbuttonexample.gif" width="50" height="200" alt="" border="0"><br><br></div><div id="lyra" style="position:absolute; left:120px; top:20px; width:160px; background-color:#F0F0F0; layer-background-color:#F0F0F0; padding:5px">A normal layer, directly within the body.</div><div id="lyrb" style="position:absolute; left:40px; top:20px; clip:rect(0px, 0px, 0px, 0px); background-color:#00FF00; layer-background-color:navy; visibility: visible; z-index:1"><a href="#" onmousedown="if(clipbutton1)clipbutton1.setState(2)" onmouseover="if(clipbutton1)clipbutton1.setState(1)" onmouseout="if(clipbutton1)clipbutton1.setState(0)" onmouseup="if(clipbutton1)clipbutton1.setState(3)" onfocus="blur()"><img src="images/clipbuttonexample.gif" width="50" height="200" alt="" border="0"></a></div><!-- PARENT LAYER FOR NESTING TEST: --><div id="parentlayer" style="position:absolute; left:20px; top:100px; background-color:green; layer-background:yellow; width:292px; height:98px;"><table cellpaclipbutton2ing="1" cellspacing="0" border="0"><tr><td bgcolor="#C0C0C0"><!-- INNER TABLE --><table cellpaclipbutton2ing="0" cellspacing="0" border="0"><tr><td bgcolor="white"><img src="images/space.gif" width="290" height="96" alt="" border="0"></td></tr></table><!-- /INNER TABLE --></td></tr></table><div id="lyrc" style="position:absolute; left:100px; top:30px; width:160px; background-color:#F0F0F0; layer-background-color:#F0F0F0; padding:5px">A normal layer, nested within the parent layer.</div><div id="lyrd" style="position:absolute; left:20px; top:26px; clip:rect(0px, 0px, 0px, 0px); visibility: visible; z-index:1"><a href="#" onmousedown="if(clipbutton2)clipbutton2.setState(2)" onmouseover="if(clipbutton2)clipbutton2.setState(1)" onmouseout="if(clipbutton2)clipbutton2.setState(0)" onmouseup="if(clipbutton2)clipbutton2.setState(3)" onfocus="blur()"><img src="images/clipbuttonexample.gif" width="50" height="200" alt="" border="0"></a></div></div></body><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/3d/js/LyrObj.jshttp://javascriptbank.com/javascript/3d/js/ClipButton.jshttp://javascriptbank.com/javascript/3d/examples/images/space.gifhttp://javascriptbank.com/javascript/3d/examples/images/clipbuttonexample.gif