首頁 > web前端 > js教程 > jquery圖片放大功能簡單實作_jquery

jquery圖片放大功能簡單實作_jquery

WBOY
發布: 2016-05-16 17:27:42
原創
773 人瀏覽過
複製程式碼如下程式碼:


jquery圖片放大功能簡單實作_jquery



body{margin:0px;}
div.zoomdiv {
z-index: 999;
位置:絕對;
頂部:0px;
左:0px;
寬度:200px;
高度:200px;
背景:#ffffff;
邊框:1px實線#CCCCCC;
顯示:無;
文字對齊:居中;
溢出:隱藏;
}
div.jqZoomPup {
z 索引:999;
可見性:隱藏;
位置:絕對;
頂部:0px;
左:0px;
寬度:50px;
高度:50px;
邊框:1px實線#aaa;
背景:#ffffffff;
不透明度:0.5;

-moz-不透明度:0.5;
-khtml-不透明度:0.5;
濾鏡:alpha(不透明度=50);
}
樣式>

$(document).ready(function(){
$(".jqzoom").jqueryzoom({
xzoom: 400, //設定放大DIV 長度(預設為200)
yzoom : 400, //設定放大DIV 高度(預設為200)
offset: 10, //設定放大DIV 偏移(預設為10)
position: "right", //設定放大DIV 的位置(預設為右邊)
preload:1,
lens:true
})
});
腳本>
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板