Jquery全屏相册插件zoomvisualizer具有调节放大与缩小

编程学习 2021-07-04 21:03www.dzhlxh.cn编程入门
本文给大家分享一款经常使用的jquery全屏相册插件zoomvisualizer具有调节放大与缩小的功能,对jquery全屏相册插件zoomvisualizer感兴趣的朋友可以通过本文学习一下

先给大家展示效果图:

          

jQuery可调节放大与缩小功能的全屏相册插件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("相册打开了!");
 }
 function removed() {
  console.log("相册关闭了!");
 }
});
</script>

Copyright © 2016-2025 www.dzhlxh.cn 金源码 版权所有 Power by

网站模板下载|网络推广|微博营销|seo优化|视频营销|网络营销|微信营销|网站建设|织梦模板|小程序模板