[转载]使用iscroll.js-tab左右滑动导航--tab点击无效果
转载自:http://blog.csdn.net/zuoyiran520081/article/details/77369421
最近在页面中用iscroll.js,但是但是有跳转,用a标签的href进行跳转发现没有用,之后转换成用点击事件,发现依然不起作用,经过查询发现是禁止了浏览器的默认事件。
有的方法说如果用button或input代替a,都能响应click事件。
如果设置click为true,原来不能点击的手机能点击了,但是原来能点击的手机变成了双击,也就是将手机本身的click和iscroll的click各执行了一次。
所以最佳的解决办法是:
1.加上click: true,和taps:true两句代码。
myScroll = new IScroll("#wrapper", {
scrollbars: true,
mouseWheel: false,
interactiveScrollbars: true,
shrinkScrollbars: 'scale',
fadeScrollbars: true,
scrollY: true,
probeType: 2,
bindToWrapper: true,
click: true,
taps:true
});
2.加上preventDefault: false代码
myScroll = new IScroll("#wrapper", {
preventDefault: false
});
注:用input的checked事件中加上方法1的代码没有什么作用,加上方法2的代码就可以实现了。
[转载]使用iscroll.js-tab左右滑动导航--tab点击无效果的更多相关文章
- iscroll.js 手机上下滑动 加载更多
html <!DOCTYPE html> <html> <head> <title>下拉上拉刷新页面代码</title> <meta ...
- 利用setTimeOut 和clearTimeOut 方法控制写一个 滑动导航显示不同信息的效果
效果如图鼠标滑动导航 下边显示不同效果 html代码和css格式代码 <body><div id="tab" class="tab"> ...
- 移动端下拉刷新,iScroll.js用法(转载)
本文转载自: iScroll.js 用法参考 (share)
- Android 原生 Android ActionBar Tab (滑动)导航
本文内容 环境 项目结构 演示一:ActionBar Tab 导航 演示二:ActionBar Tab 带滑动导航 本文演示 Tab 导航.第一个演示,是基本的 Tab 导航,第二个是带滑动的 Tab ...
- css+js实现自动伸缩导航栏
用css+js实现自动伸缩导航栏 需要达到的效果: 默认首页选中样式 设置鼠标滑过效果:颜色变化(#f60),宽度变化,字体变化 所涉及的知识点: 布局:float css: 元素状态切换(displ ...
- Vue如何实现swiper左右滑动内容区控制导航tab同时切换高亮
Vue如何实现左右滑动内容区控制导航tab同时切换高亮,实现的效果是:点击导航按钮时内容区发生改变,左右滑动内容区时导航按钮跟随切换高亮,停留在某个内容区时刷新页面后仍然停留在当前内容区. ...
- Android典型界面设计(6)——ActionBar Tab+ViewPager+Fagment实现滑动导航
一.问题描述 在Android典型界面设计一文中,实现典型滑动导航界面,其实使用ActionBar 也可以轻松实现这一效果,甚至也可实现类似Android典型界面设计(3)的双导航效果.可见Actio ...
- (转载)iscroll.js的使用
入门 Scroll是一个类,每个需要使用滚动功能的区域均要进行初始化.每个页面上的iScroll实例数目在设备的CPU和内存能承受的范围内是没有限制的. 尽可能保持DOM结构的简洁.iScroll使用 ...
- 关于Iscroll.js 的滑动和Angular.js路由冲突问题
Iscroll主要应用于app移动端开发. 主要代码: window.onload=function(){ var myIscroll=new IScroll(".headerNav&quo ...
随机推荐
- ohasd failed to start: Inappropriate ioctl for device
今天同事在安装GI的时候出现故障.让我帮忙看一下. 以下记录例如以下: 问题现象: 在安装gi的时候运行root.sh报例如以下错误: Finished running generic part of ...
- hdu 4969 Just a Joke(积分)
题目链接:hdu 4969 Just a Joke 题目大意:Guizeyanhua要去追一个女孩,女孩在以Guizeyanhua为圆心,半径为R的圆上匀速运动,女孩的速度为v1,Guizeyanhu ...
- android adt 最新下载地址
打开这个网址就可以看到adt的详细信息: http://developer.android.com/sdk/installing/installing-adt.html 或者直接在你的eclipse ...
- 使用NPOI读取Excel出错
使用NPOI读取Excel出错,错误信息:java.io.IOException: Invalid header signature; read 4503608217567241, expected ...
- Silverlight Telerik RadGridView动态增删行及行列操作(转载)
最近使用一直使用第三方控件Telerik,版本 2011 Q1,一直使用显示控件RadGridView,使用起来比DataGird好使, 也发现有控件问题. radgridview.BeginInse ...
- 微信支付和微信支付通知基于sdk的说明
前提是,有微信服务号(必须开通了支付功能,也就是说有了商户后台) (注意商户后台 安全目录 的设置,不然即使你写的没错误,也调用不成功) 公众号h5页面写法: (购物车提交--我们上一步已经生成了订 ...
- vivado2016.2下系统自带DDR3 ip例程仿真运行
背景:从ISE14.7迁移到vivado2016.2. xilinx的软件改的真是不一般的大.两个软件操作差距真是让人想骂人.由于项目需要,准备调试DDR3.对于新手来说,例化一个DDR3 ip.如果 ...
- 43. Spring Boot动态数据源(多数据源自动切换)【从零开始学Spring Boot】
[视频&交流平台] àSpringBoot视频 http://study.163.com/course/introduction.htm?courseId=1004329008&utm ...
- OC-7-内存管理
课程要点: 内存管理的必要性 MRC(手动管理) 自动释放池 ARC是怎么对内存进行管理的 内存管理的必要性 OC是一门面向对象的语言,在软件运行过程中会创造大量的对象,每创建一个对象系统就会给其分配 ...
- Struts2 异常处理
Struts提供了一个更简单的方式来处理未捕获的异常,并将用户重定向到一个专门的错误页面.您可以轻松地Struts配置到不同的异常有不同的错误页面. Struts的异常处理所使用的“exception ...