步驟如下: (1) 準備圖片(左右箭頭,以及一些範例圖片) (2) JS(jquery)的程式碼如下: 複製程式碼 程式碼如下: <BR>var picPath = new Array(); <BR>picPath.push("Images/chuang_yhb.jpg"); <BR>picPath. push("Images/dong_wgx.jpg"); <BR>picPath.push("Images/gao_xsg.jpg"); <BR>var index = 0; <BR>$(function() { <BR>var top = $("#img1").offset().top; <BR>var left = $("#img1").offset().left; <BR>var height = $("#img1").height( ); <BR>var width = $("#img1").width(); <BR>$("#img1").attr({ "src": picPath[index] }); <BR>$( "#img1").parent().hover(function() { <BR>//show the arrow left and right <BR>$("#leftArrow").show(); <BR>$("#rightArrow ").show(); <BR>$("#leftArrow").css({ "left": left - 10, "top": top (height / 2) }); <BR>$("#rightArrow ").css({ "left": left width, "top": top (height / 2) }); <BR>}, function() { <BR>//hide the arrrow left and right <BR>$ ("#leftArrow").hide(); <BR>$("#rightArrow").hide(); <BR>}); <BR>$("#leftArrow").click(function() { <BR>if (index > 0) { <BR>$("#img1").attr({ "src": picPath[--index] }); <BR>} <BR>}); <BR>$ ("#rightArrow").click(function() { <BR>if (index < picPath.length) { <BR>$("#img1").attr({ "src": picPath[ index] }); <BR>} <BR>}); <BR>}); <BR> (3) Html部分如下: 複製程式碼 程式碼如下: 下面再附一個js版的