<div class="codetitle"> <span><a style="CURSOR: pointer" data="59025" class="copybut" id="copybut59025" onclick="doCopy('code59025')"><u>複製程式碼</u></a></span> 程式碼如下:</div> <div class="codebody" id="code59025"> <br> <br><title></title> <br> <br><script src="jquery-1.9.1.js" type="text/javascript"></script> <br><style type="text/css"> <BR>img <BR>{ <BR> width:150px; <BR>height:200px; <BR>position:relative; <BR>} <BR>td{width:150px;height:200px;} <BR>table{border:150px;height:200px;} <BR>table{border:solid 1px ackal; ></style> <br><script type="text/javascript"> <BR>$(function () { <BR>$('img').click(function () { <BR>$(this) .animate({ left: ' =150px' }, 2000).animate({ left: ' =150px' }, 2000).animate({ top: ' =200px' }, 2000).animate({ left: '- =150px' }, 2000).animate({ left: '-=150px' }, 2000).animate({ top: ' =200px' }, 2000).animate({ left: ' =150px' }, 2000) .animate({ left: ' =150px' }, 2000); <BR>}) <BR>//停止動畫，當一個元素有一個動畫隊列時，停止的是當前動畫，緊接著執行下一個動畫<BR>$('#btnStop').click(function () { <BR>$('img').stop(); <BR>}) <BR>$('#btnYanChi').click(function ( ) { <BR>$('img').delay(2000).hide(2000); <BR>}) <BR>}) <BR></script> <br> <br> <br><table> <br><tr> <br><td> <br><img src="images/%E6%B7%9A%E5%A5%941.gif" alt="animate動畫範例(淚奔的小孩)及stop和delay的使用_jquery" > <br> </td> <br><td> <br> <br> </td> <br><td> <br> <br> </td> <br> </tr> <br><tr> <br><td> <br> <br> </td> <br><td> <br> <br> </td> <br><td> <br> <br> </td> <br> </tr> <br><tr> <br><td> <br> <br> </td> <br><td> <br> <br> </td> <br><td> <br> <br> </td> <br> </tr> <br> </table> <br><input id="btnStop" type="button" value="stop"> <br><input id="btnYanChi" type="button" value="延遲執行"> <br> </div>
