SlidesJS 3.0.4 http://slidesjs.com

在手机上遇到的一些问题及解决办法

1.手机上打开有sliderjs的页面后, 切换到别的页面再回来时, sliderjs部分不能滑动了
2.手机上打开有sliderjs的页面后, 在sliderjs部分不断的进行上下滑动时, 会出现空白的情况

html:

 <div class="m-banner">
<p class="prev"><span class="spr_btnPrev"></span></p>
<p class="next"><span class="spr_btnNext"></span></p>
<div class="bnrImg">
<div class="banner bnr4"><a target="_blank" href="//genji.anipani.jp/">源氏物語 男女逆転恋唄</a></div>
<div class="banner bnr1"><a target="_blank" href="#">DAME×PRINCE</a></div>
<div class="banner bnr2"><a target="_blank" href="#">君の秘密にドラマなキスを</a></div>
<div class="banner bnr3"><a target="_blank" href="#">美男高校地球防衛部LOVE!GAME!</a></div>
</div>
<ul class="btnDot">
<li><span class="spr_btnDot on"></span></li>
<li><span class="spr_btnDot"></span></li>
<li><span class="spr_btnDot"></span></li>
<li><span class="spr_btnDot"></span></li>
</ul>
</div>

js: 问题解决见代码58 59行

jQuery(function($){
var $btnDot = $('.btnDot');
var $navigation, $pagination, $previous, $next;
var si = 0;
var $spr_btnDot = $btnDot.find('.spr_btnDot'); function handle(){
clearInterval(si);
si = setInterval(function(){
$next.click();
}, 5000);
}
$('.bnrImg').slidesjs({
width: 320,
height: 300,
play: {
interval: 5000,
auto: false
},
callback: {
loaded: function(num){
$(".slidesjs-container").css("height", $('.bnrImg').height());
$navigation = $('.slidesjs-navigation');
$pagination = $('.slidesjs-pagination');
$previous = $('.slidesjs-previous');
$next = $('.slidesjs-next');
handle();
},
complete: function(num){
$spr_btnDot.removeClass('on');
$spr_btnDot.eq(num-1).addClass('on');
}
}
}); $navigation.hide();
$pagination.hide();
var $m_banner = $('.m-banner');
$m_banner.on('click', '.spr_btnPrev', function(){
$previous.click();
handle();
});
$m_banner.on('click', '.spr_btnNext', function(){
$next.click();
handle();
}); $btnDot.on('click', '.spr_btnDot', function(){
var $this = $(this);
var idx = $spr_btnDot.index($this);
$pagination.find('a').eq(idx).click();
handle();
}); function getMobileOperatingSystem() {
var userAgent = navigator.userAgent || navigator.vendor || window.opera;
if( userAgent.match( /iPad/i ) || userAgent.match( /iPhone/i ) || userAgent.match( /iPod/i ) || userAgent.match( /Android/i )) {
$(window).unbind("resize"); //解决问题2
window.onblur = function() { //解决问题1
clearInterval(si);
};
window.onfocus = function() {
handle();
};
}
} window.onload = function(){
getMobileOperatingSystem();
} });

  

SlidesJS 3.0.4 在手机上遇到的一些问题及解决办法的更多相关文章

  1. IIS7.5中调试.Net 4.0网站出现无厘头500错误的解决办法 (转)

    刚刚 部署了ii7的dll的有x86写的,就会出现以下这样的问题 iis 7 x86,Could not load file or assembly 'Name' or one of its depe ...

  2. echart 饼图数据为0不显示或者太小显示其他的解决办法

    饼图数据为0或者太小显示如下,不美观 解决办法: 为0的去掉,小于0.005的累加起来 方法 function getsData(_rowData){ var rowData=JSON.parse(J ...

  3. [异常解决] 安卓6.0权限问题导致老蓝牙程序出现异常解决办法:Need ACCESS_COARSE_LOCATION or ACCESS_FINE_LOCATION permission...

    一.问题: 之前写的一款安卓4.4的应用程序,用来连接蓝牙BLE,而现在拿出来用新的AS编译(此时SDK为6.0,手机也是6.0)应用程序并不能搜索到蓝牙,查看log总是报权限错误: Need ACC ...

  4. VC++6.0在win8.1系统下运行失败的解决办法

    在win8.1系统下安装了VC++6,.0编译软件之后,发现打不开.出现下面的错误: 解决办法: 安装文件目录:Microsoft Visual Studio--common--MSDev98--Bi ...

  5. Duplicate entry '0' for key 'PRIMARY'的一种可能的解决办法

    在MySQL设计好数据库往往数据库中插入数据的时候, 因为主键ID默认是不赋值的,只给其他项目赋值了,相关的SQL代码是这样的 StringBuilder strSql = new StringBui ...

  6. 关于SpringBoot 2.0,Pageable 无法注入,提示缺少默认构造方法的解决办法

    在SpringBoot 2.0 以前,我们会配置以下类 * @date 2018/06/03 */ @Configuration public class WebMvcConfig extends W ...

  7. Mysql8.0 Public Key Retrieval is not allow错误的解决办法

    在使用Mysql 8.0时重启后启动项目的事后会报错com.mysql.jdbc.exceptions.jdbc4.MysqlNonTransientConnectionException: Publ ...

  8. IDEA里运行代码时出现Error:scalac: error while loading JUnit4, Scala signature JUnit4 has wrong version expected: 5.0 found: 4.1 in JUnit4.class错误的解决办法(图文详解)

    不多说,直接上干货!  问题详情 当出现这类错误时是由于版本不匹配造成的 Information:// : - Compilation completed with errors and warnin ...

  9. VS2010中 打开vc6.0的工程时,遇到的问题及解决办法

    用VS2010打开vc6.0的工程时,遇到了很多的问题,下面记录下解决办法. 1. 报错: error C2065: “i”: 未声明的标识符 解决办法: 提出 i 的申明,因为 i 的申明可能在fo ...

随机推荐

  1. head tail 命令

    [一]从第3000行开始,显示1000行.即显示3000~3999行 cat filename | tail -n +3000 | head -n 1000 [二]显示1000行到3000行 cat ...

  2. Java中url传递中文参数取值乱码的解决方法

    java中URL参数中有中文值,传到服务端,在用request.getParameter()方法,得到的常常会是乱码,这将涉及到字符解码操作. 方法一: http://xxx.do?ptname=’我 ...

  3. ARC __bridge modifiers demystified

    http://stackoverflow.com/questions/14207960/arc-bridge-modifiers-demystified Because I learned what ...

  4. hdoj 2036 改革春风吹满地

    改革春风吹满地 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Sub ...

  5. ASP.NET【2】

    从上一节我们了解到ASP.NET是一种动态网页技术,在服务器端运行.Net代码,服务器端接收处理动态生成HTML代码,然后发送给浏览器,再由浏览器解析HTML代码将数据呈现给用户. 那么,下面我来介绍 ...

  6. 322. Coin Change

    动态规划里例题,硬币问题. p[i] = dp[i - coin[j]] + 1; 注意i < coin[j] dp[i-coin[j]]无解都要跳过. public class Solutio ...

  7. codeforces 714C解题报告

    http://codeforces.com/contest/714/problem/C #include <bits/stdc++.h>//非递归形式建立字典树 using namespa ...

  8. datasorttable表格

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. [Redux] Normalizing the State Shape

    We will learn how to normalize the state shape to ensure data consistency that is important in real- ...

  10. Xcode 5 安装coco2d-iphone

    从http://www.cocos2d-iphone.org/download/下载并解压缩最新版本的cocos2d,默认情况下会保存在 /Users/XXX/Downloads/cocos2d-ip ...