本例中主要用到了jquery.js,jquery.jqzoom.js以及樣式jqzoom.css,
為了示範方便,這裡引用了一個購物網站的絕對路徑,大家可以把jquery代碼下過來自己用 .
應用參考:http://www.vancl.com/ProductInfo/1120222.html
img標籤中的
alt是大圖片的路徑,
src是小圖片的路徑,
class=jqzoom,設定樣式,
border=0圖片的邊框。
下面的MM怎麼樣啊,呵呵!!!!
<HTML>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<link href="http://www.vancl.com/css/jqzoom.css" type="text/css" rel="stylesheet" />
<SCRIPT src="http://www.vancl.com/PublicControls/js/jquery.js" type=text/javascript></SCRIPT>
<SCRIPT src="http://www.vancl.com/PublicControls/js/jquery.jqzoom.js"></SCRIPT>
<SCRIPT type=text/javascript>...
jQuery.noConflict();
jQuery(document).ready(function()...{
jQuery("img.jqzoom").jqueryzoom(...{
xzoom: 280,
yzoom: 280,
offset: 15,
position: "right"
});
});
</SCRIPT>
<BODY>
<IMG class=jqzoom
alt=http://img.article.pchome.net/game/00/07/75/84/pic_lib/wm/424.jpg
src=http://t1.baidu.com/it/u=2111826760,700048667&fm=0&gp=6.jpg
border=0 >
</BODY>
</HTML>