[转载]使用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 ...
随机推荐
- nginx和Tomcat集成后发生的重定向问题分析和解决
nginx和Tomcat集成后发生的重定向问题分析和解决 Tomcat前端配置一个HTTP服务器应该是大部分应用的标配了,基本思路就是所有动态请求都反向代理给后端的Tomcat,HTTP服务器来处 理 ...
- 使用sql语句实现添加、删除约束
--主键约束(Primary Key constraint):要求主键列的数据唯一,并且不允许为空. --唯一约束(Unique Constraint):要求该列唯一,允许为空,但只能出现一个空值. ...
- 出现蓝屏代码0x0000007b的原因及解决办法
出现蓝屏代码0x0000007b的原因通常是硬盘的存储控制器驱动加载错误,我们可以通过对BIOS界面进行修复来解决这个问题.下面小编将详细介绍解决蓝屏代码0x0000007b的方法,一起来看看吧 导致 ...
- Pushlet后台推送
1.Pushlet 是一个开源的 Comet 框架,Pushlet 使用了观察者模型:客户端发送请求,订阅感兴趣的事件:服务器端为每个客户端分配一个会话 ID 作为标记,事件源会把新产生的事件以多播的 ...
- Angular 2 组件之间如何通信?
组件之间的共享可以有好几种方式 http://learnangular2.com/outputs/ 实例参考https://angular.io/docs/ts/latest/cookbook/com ...
- NIO之直接缓冲区与非直接缓冲区
直接缓冲区与非直接缓冲区的概念 一.非直接缓冲区 1)创建方式 通过 static ByteBuffer allocate(int capacity) 创建的缓冲区,在JVM中内存中创建,在每次调用基 ...
- ubuntu 12.04LTS下jdk 6安装记录
这两天突然对ubuntu产生了兴趣,决定来折腾一下,:-) 由于开发一般都是在java上进行,所以第一步就是得把环境搭建好,折腾了一会儿,现在把过程记录一下. Step 1 下载jdk6 地址是 ht ...
- Atitit.编程语言新特性 通过类库框架模式增强 提升草案 v3 q27
Atitit.编程语言新特性 通过类库框架模式增强 提升草案 v3 q27 1. 修改历史2 2. 适用语言::几乎所有编程语言.语言提升的三个渠道::语法,类库,框架,ide2 2.1. 单根继承 ...
- 206. Reverse Linked List【easy】
206. Reverse Linked List[easy] Reverse a singly linked list. Hint: A linked list can be reversed eit ...
- AutoLayout详解+手把手实战(转载)
首先说一下这篇博客虽然是标记为原创,但是事实并非本人亲自写出来的,知识点和例子本人花了一天各处查 找和整理最终决定写一个汇总的详解,解去各位朋友到处盲目查找的必要,因为不是转载某一个人的内容,故此不标 ...