js滚轮换切屏
因为全项目不是自己写的,仅仅是帮别人写js滚轮代码,并且别人项目也还未上线。所以仅仅贴出自己写的那段部分代码,
效果:鼠标滚轮滚动时。网頁屏幕一屏一屏的上下切换
(下面代码在本地电脑的IE,chrome与FireFox这三个浏览器已经測试而且已经成功)
var sum=0;
var oTxt=document.getElementById("txt");
var scrollFunc=function(e){ var direct=0;
var men = $(".menu_m").find(".menu").find("li");
men.each(function (j) {
if($(this).attr("class")=="m_selected"){
sum=j;
}
});
e=e || window.event;
if(e.wheelDelta){//IE/Opera/Chrome
if(navigator.appName=='Netscape'){
// Chorme滚一次有两次的效果,所以加0.5
if(e.wheelDelta>0){ sum=parseFloat(sum-0.5); }
else{ sum=parseFloat(sum)+0.5; }
}else{
if(e.wheelDelta>0)
sum=parseFloat(sum-1);
else
sum=parseFloat(sum+1);
}
}else if(e.detail){//Firefox
//firefox向上向下的值不和上面的一样,可打印出看看
if(e.detail>0)
sum=parseFloat(sum+1);
else
sum=parseFloat(sum-1);
}
//sum出来的。以下就是你想做的事情,我这里是写与当前项目有所以相关联的屏目跳转,但记的要加return false; 要不然,在google和ie中时会出现,滚多了
var sizes= $(".menu_m").find(".menu").find("li").size();
if(sum>=0&&parseFloat(sum)<=parseFloat(sizes)-1){
men.each(function (j) {
$(this).removeClass("m_selected")
});
$(".menu_m").find(".menu li:eq("+sum+")").find("span").click();
return false;
} }
/*注冊事件*/
if(document.addEventListener){
document.addEventListener('DOMMouseScroll',scrollFunc,false);
}//W3C
window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome/Safari
js滚轮换切屏的更多相关文章
- Hammer.js移动端触屏框架的使用
hammer.js是一个多点触摸手势库,能够为网页加入Tap.Double Tap.Swipe.Hold.Pinch.Drag等多点触摸事件,免去自己监听底层touchstart.touchmove. ...
- arcgis js之地图分屏同步
arcgis js之地图分屏同步 原理: 新建两个map两个view或者一个map两个view.对地图进行移动事件绑定,在地图移动时同步地图方位 代码: views.forEach((view) =& ...
- 利用snowfall.jquery.js实现爱心满屏飞
小颖在上一篇一步一步教你用CSS画爱心中已经分享一种画爱心的方法,这次再分享一种方法用css画爱心,并利用snowfall.jquery.js实现爱心满屏飞的效果. 第一步: 利用伪元素before和 ...
- android3.2以上切屏禁止onCreate()
一般切屏禁止onCreate()方法需要将activity加上属性: android:configChanges=”orientation|keyboardHidden” 但是在3.2以上就不起作用了 ...
- 关于LCD的分屏与切屏 Tearing effect
详细文档(带图片):http://download.csdn.net/detail/xuehui869/5268852 1.LCM之Fmark功能 http://blog.csdn.net/zhand ...
- zepto.js swipe实现触屏tab菜单
今天我们来说下zepto.js,有兴趣的朋友可以先进这个网站“http://zeptojs.com/” ,这个可以说是手机里的jquery,但是它取消了hover,加上了swipe及tap这两个触屏功 ...
- js 利用canvas + flv.js实现视频流 截屏 、本地下载功能实现,兼容火狐,谷歌;canvas截屏跨域问题,无音频视频流加载不显示问题
项目:物联网监控项目----后台视频流管理(前端实现视频截屏功能) 本文就不同视频源分情况展示: 1 本地视频(项目同目录视频)截屏(canvas.getContext("2d).drawI ...
- 学习 JS滚轮事件(mousewheel/DOMMouseScroll)
学习 JS滚轮事件(mousewheel/DOMMouseScroll) 1-1 滚轮事件兼容性的差异 IE,chrome,safari 浏览器都使用 onmousewheel, 只有firefo ...
- js秒换成天时分
js秒换成天时分 function timeStamp( second_time ){ var time = parseInt(second_time) + "秒"; if( pa ...
随机推荐
- Intellij 下 mybatis 插件 MyBatisCodeHelperPro破解
步骤1.破解包下载地址:https://gitee.com/pengzhile/MyBatisCodeHelper-Pro-Crack/releases 步骤2.下载:Intellij IDEA p ...
- 重新学习Java——对象和类(一)
之前通过记笔记的方法,对于<Java核心技术>这本书的前一章进行了重新的复习,感觉效果很好,比单独看书带来了更好的复习效果,了解了很多以前不是很注意的一些细节,但是在一些自己较为熟悉的地方 ...
- poj2367 Genealogical tree
思路: 拓扑排序,这里是用染色的dfs实现的.在有环的情况下可以判断出来,没有环的情况下输出拓扑排序序列. 实现: #include <vector> #include <cstri ...
- 可以在一个html的文件当中读取另一个html文件的内容
1.IFrame引入,看看下面的代码 <IFRAME NAME="content_frame" width=100% height=30 marginwidth=0 marg ...
- Selenium IDE的第一个测试用例——路漫长。。。
一周时间过去了,断断续续学习selenium也有几个小时了:今天细想一下学习效率不高的原因在哪,总结出以下几点: 1.求“进”心切——总想一步到位,搭建好环境,开始动手写用例. 2.学习深度不够——同 ...
- vue路由传参(学习心得)
如果组件通过query来传递num参数为1,相当与在 url 地址后面拼接参数 <template> <div> <h3>首页</h3> <rou ...
- JavaScript 单例,Hash,抛异常
1. 单例 ECMA 5 版 记得以前写过几种单例实现,找不到了... function Singleton() { if (this.constructor.instance) { return t ...
- Spring框架系列(二)--装配和注入Bean
企业日常开发中,几乎都是Spring系的框架,无论是SSM.还是现在大火的SpringBoot+JPA/MyBatis,使用最大的目的就是简化开发 基本模块: 核心容器:Beans.Core.Cont ...
- JavaScipt30(第一个案例)(主要知识点:键盘事件以及transitionend)
今天得到一个github练习项目,是30个原生js写成的小例子,麻雀虽小五脏俱全,现在记录一下第一个. 第一个是键盘按键时页面上对应的键高亮,同时播放音频,松开后不再高亮. 我自己实现了一下,然后查看 ...
- Window下的———JDK环境的配置
1.先把JDK文件解压在一个文件夹里 2.去到 3.具体配置3个 具体按照这样文件路径配置.(CLASSPATH 需要添加一个 . ;加路径 ) 4.最后检验 显示出JDK版本号就表示配置成 ...