微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery插件MovingBoxes实现左右滑动中间放大图片效果

MovingBoxes左右滑动放大图片插件在产品预览时很有用哦

实例代码

rush:js;"> <html xmlns="http://www.w3.org/1999/xhtml"&gt;

Moving<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>es滑动放大<a href="https://www.jb51.cc/tag/tupian/" target="_blank" class="keywords">图片</a><a href="https://www.jb51.cc/tag/chajian/" target="_blank" class="keywords">插件</a>

<link type="text/css" href="/api/jq/5733e358c8829/css/style.css" rel="external nofollow" rel="stylesheet">

<script type="text/javascript" src="/api/jq/5733e358c8829/js/jquery.js">

<script type="text/javascript" src="/api/jq/5733e358c8829/js/jquery.movingBoxes.js">

<script type="text/javascript">

$(function() {

 $('#focus').moving<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>es({

  startPanel: 1,// 从第<a href="https://www.jb51.cc/tag/yige/" target="_blank" class="keywords">一个</a>li开始

  reducedSize: .5,// 缩小到原图50%的尺寸

  wrap: true,// 是否无缝循环

  buildNav: false,// 是否<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a><a href="https://www.jb51.cc/tag/fenye/" target="_blank" class="keywords">分页</a>

  navFormatter: function() {

   return "●";// 返回<a href="https://www.jb51.cc/tag/fenye/" target="_blank" class="keywords">分页</a>格式

  }

 });

});

<ul id="focus">

  • 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

    版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

    相关推荐


    jQuery表单验证提交:前台验证一(图文+视频)
    jQuery表单验证提交:前台验证二(图文+视频)
    jQuery如何实时监听获取input输入框的值
    JQuery怎么判断元素是否存在
    jQuery如何实现定时重定向
    jquery如何获取复选框选中的值
    jQuery如何清空form表单数据
    jQuery怎么删除元素节点
    JQuery怎么循环输出数组元素
    jquery怎么实现点击刷新当前页面