JQuery 定時操作實現圖片顯示與隱藏
阿新 • • 發佈：2018-12-17
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="../js/jquery-1.8.3.js" ></script> <script> $(function(){ time = setInterval("showAd()",3000); }); function showAd(){ // 1. $("#img1").show(); // 2. $("#img1").slideDown(); // 3. $("#img1").fadeIn(); clearInterval(time); time = setInterval("hiddenAd()",3000); } function hiddenAd(){ // 1. $("#img1").hide(); // 2. $("#img1").slideUp(); // 3. $("#img1").fadeOut(); clearInterval(time); } </script> <script> $(function(){ $("#btn1").click(function(){ $("#img2").toggle(); }); }); </script> </head> <body> <img src="../img/1.jpg" style="display: none;" id="img1"/> <input type="button" id="btn1" value="btn"/><br /> <img src="../img/big01.jpg" id="img2"/> </body> </html>