Jquery全屏相冊(cè)插件zoomvisualizer具有調(diào)節(jié)放大與縮小功能
更新時(shí)間：2015年11月02日 14:16:35 投稿：mrr
本文給大家分享一款經(jīng)常使用的jquery全屏相冊(cè)插件zoomvisualizer具有調(diào)節(jié)放大與縮小的功能，對(duì)jquery全屏相冊(cè)插件zoomvisualizer感興趣的朋友可以通過(guò)本文學(xué)習(xí)一下
先給大家展示效果圖：
jQuery可調(diào)節(jié)放大與縮小功能的全屏相冊(cè)插件zoomVisualizer。
文件引用：
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/ZoomVisualizer.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
$(window).ZoomVisualizer({
added: added,
removed: removed,
object: '#zoom-visualizer',
resizeInitial: true,
centerThumbs: true,
loader: "img/ajax-loader-overlay.gif",
sliderOrientation: "vertical",
positionZoom: {
left: 10,
right: 10,
top:10,
bottom:10
}
});
function added() {
console.log("相冊(cè)打開(kāi)了！");
}
function removed() {
console.log("相冊(cè)關(guān)閉了！");
}
});
</script>
您可能感興趣的文章:
- jquery+html仿翻頁(yè)相冊(cè)功能
- jquery+CSS3實(shí)現(xiàn)3D拖拽相冊(cè)效果
- 非常漂亮的相冊(cè)集 使用jquery制作相冊(cè)集
- jQuery實(shí)現(xiàn)帶滾動(dòng)導(dǎo)航效果的全屏滾動(dòng)相冊(cè)實(shí)例
- jQuery插件實(shí)現(xiàn)大圖全屏圖片相冊(cè)
- jquery實(shí)現(xiàn)相冊(cè)一下滑動(dòng)兩次的方法
- 基于spring+hibernate+JQuery開(kāi)發(fā)之電子相冊(cè)(附源碼下載)
- jQuery 網(wǎng)易相冊(cè)鼠標(biāo)移動(dòng)顯示隱藏效果實(shí)現(xiàn)代碼
- 收集的10個(gè)免費(fèi)的jQuery相冊(cè)
- Html5+jQuery+CSS制作相冊(cè)小記錄
相關(guān)文章
下面小編就為大家?guī)?lái)一篇json定義及jquery操作json的方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09
jQuery ajax serialize()方法的使用以及常見(jiàn)問(wèn)題解決
使用ajax時(shí)，常常需要拼裝input數(shù)據(jù)為'name=abc&sex=1'這種形式，用JQuery的serialize方法可以輕松的完成這個(gè)工作接下來(lái)介紹jQuery ajax - serialize() 方法定義和用法，感興趣的朋友可以了解下啊，希望本文對(duì)你有所幫助2013-01-01
jquery實(shí)現(xiàn)的樹(shù)形目錄實(shí)例
這篇文章主要介紹了jquery實(shí)現(xiàn)的樹(shù)形目錄,涉及jquery針對(duì)頁(yè)面元素及鼠標(biāo)事件的相關(guān)操作技巧,需要的朋友可以參考下2015-06-06
這篇文章主要為大家詳細(xì)介紹了避免jQuery名字沖突，noConflict()方法，感興趣的朋友可以參考一下2016-07-07
基于jQuery的倒計(jì)時(shí)實(shí)現(xiàn)代碼
昨天看了妙味課堂的倒計(jì)時(shí)視頻，自己學(xué)著寫(xiě)了下，需要的朋友可以參考下2012-05-05
jquery+css實(shí)現(xiàn)移動(dòng)端元素拖動(dòng)排序
這篇文章主要為大家詳細(xì)介紹了jquery+css實(shí)現(xiàn)移動(dòng)端元素拖動(dòng)排序，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-02-02
jquery實(shí)現(xiàn)鼠標(biāo)懸浮停止輪播特效
這篇文章主要介紹了jquery實(shí)現(xiàn)鼠標(biāo)懸浮停止輪播特效，鼠標(biāo)懸停在圖片上則停止輪播，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2015-12-12
這篇文章主要介紹了jQuery中trigger()與bind()用法,結(jié)合實(shí)例形式分析了trigger()與bind()的功能、定義及具體使用技巧,需要的朋友可以參考下2015-12-12
很多網(wǎng)站的首頁(yè)都有廣告輪播，今天閑來(lái)看了一網(wǎng)站的首頁(yè)廣告輪播方式，是通過(guò) jQuery的blockSlide插件實(shí)現(xiàn)的，然后自己測(cè)試了一下，很好。2010-11-11
jQuery+canvas實(shí)現(xiàn)簡(jiǎn)單的球體斜拋及顏色動(dòng)態(tài)變換效果
這篇文章主要介紹了jQuery+canvas實(shí)現(xiàn)簡(jiǎn)單的球體斜拋及顏色動(dòng)態(tài)變換效果,通過(guò)jQuery+html5的canvas利用時(shí)間函數(shù)進(jìn)行實(shí)時(shí)數(shù)學(xué)運(yùn)算動(dòng)態(tài)繪制拋物線圖形的技巧,需要的朋友可以參考下2016-01-01