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. cf293E Close Vertices(树分治+BIT)

    E. Close Vertices You've got a weighted tree, consisting of n vertices. Each edge has a non-negative ...

  2. vmware10安装win8x64(亲测)

    首先,创建虚拟机,选择典型 下一步后 弄完后选择“完成”,这下就可以安装了 之后分区,之后选cdrom做启动,之后安装win8到第一分区

  3. linux 多线程基础4

    六.线程的作用域 函数pthread_attr_setscope和pthread_attr_getscope分别用来设置和得到线程的作用域,这两个函数的定义如下: 7. 名称:: pthread_at ...

  4. ios 页面滑入滑出

    从左边滑进 CGRect r1,r2; r1 = app.testview.view.frame; r2 = self.view.frame; [app.testview.view setFrame: ...

  5. 如何使用chown?

    以test为例,目前test归root用户拥有,也归root组拥有 [root@localhost home]# ls -al total 36 drwxr-xr-x    6 root     ro ...

  6. 使用int?来确保值类型也可以为null

    基元类型为什么需要为null?考虑两个场景: 1)数据库中一个int字段可以被设置为null.在C#中,值被取出来后,为了将它赋值给int类型,不得不首先判断一下它是否为null.如果将null直接赋 ...

  7. engine的工具中实现Snapping(捕捉)

    在Engine的工具(ITool)里: OnClick事件处理函数中: 首先需要获取一个图层,作为Snapping的参照, IFeatureLayer targetLayer 然后声明一个IMoveP ...

  8. zookeeper与activemq最新存储replicatedLevelDB整合

    测试环境:三台VM虚拟机centos6.4 64位 mini版,IP分别为192.168.1.191/192/193. 测试目的:测试activemq的failover以及与zookeeper的整合 ...

  9. 在JSP页面中调用另一个JSP页面中的变量

    在jsp学习中,经常需要在一个jsp页面中调用另一个jsp页面中的变量,下面就这几天的学习,总结一下. jsp页面之间的变量调用有多种方法: 1.通过jsp的内置对象—request对象获取参数: ( ...

  10. 在Windows下使用MinGW静态编译Assimp

    使用MinGW静态编译Assimp 到了5月份了,没有写一篇日志,于是自己从知识库里面拿出一篇文章充数吧.这次将要解说怎样在Windows下使用MinGW静态编译Assimp. Assimp是眼下比較 ...