码迷,mamicode.com
首页 > Web开发 > 详细

swipe js bug

时间:2014-05-10 08:32:41      阅读:453      评论:0      收藏:0      [点我收藏+]

标签:des   style   blog   class   code   java   

最近因为要写新的mobile site页面,有好几个页面上面必须用到photo slider。

使用插件:

/*
 * Swipe 2.0
 *
 * Brad Birdsall
 * Copyright 2013, MIT License
 *
*/

Github:https://github.com/thebird/Swipe

在使用的时候,发现只要是在两张照片的情况下,你会在chrome的F12调试中的Elements选项中发现swipe js使用js动态创建出来了4个div,这里是使用如下的代码:

bubuko.com,布布扣
 1  <div id=‘mySwipe‘ style=‘max-width:500px;margin:0 auto;padding-top:0px;‘ class=‘swipe‘>
 2     <div class=‘swipe-wrap‘>
 3       __(foreach from=$all_content_information item=content_information)__
 4          __(if $content_information.content_type == "image")__
 5            <div>
 6               <img src="__($host_application_prefix)____($content_information.fields.image.value)__" style="width:100%;height:280px;" />
 7            </div>
 8          __(/if)__
 9       __(/foreach)__
10    </div>
11 </div>

bubuko.com,布布扣

 

那个调试的就不截图了,但是你使用Ctrl+u查看源代码就会发现源代码中的图片数是正确的。所以模板当中不存在条件判断失误的问题了,只能是在swipe js中出现问题。

于是,顺藤摸瓜,打开swipe.js文件后,如果在Line 47-Line 53就发现了那一段在处理两张图片时候的代码。

bubuko.com,布布扣
 1 //Source codes: 
 2  if (browser.transitions && options.continuous && slides.length < 3) {
 3       element.appendChild(slides[0].cloneNode(true));
 4       element.appendChild(element.children[1].cloneNode(true));
 5       slides = element.children;
 6     }
 7 
 8 //Modified codes:
 9 
10   //special case if two slides
11     if (browser.transitions && options.continuous && slides.length < 3) {
12       //element.appendChild(slides[0].cloneNode(true));
13       //element.appendChild(element.children[1].cloneNode(true));
14       //slides = element.children;
15     }
bubuko.com,布布扣

不想知道根源的,只需要将那个if注销就好了。

 

swipe js bug,布布扣,bubuko.com

swipe js bug

标签:des   style   blog   class   code   java   

原文地址:http://www.cnblogs.com/shuman/p/3719199.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!