因为全项目不是自己写的,仅仅是帮别人写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滚轮换切屏的更多相关文章

  1. Hammer.js移动端触屏框架的使用

    hammer.js是一个多点触摸手势库,能够为网页加入Tap.Double Tap.Swipe.Hold.Pinch.Drag等多点触摸事件,免去自己监听底层touchstart.touchmove. ...

  2. arcgis js之地图分屏同步

    arcgis js之地图分屏同步 原理: 新建两个map两个view或者一个map两个view.对地图进行移动事件绑定,在地图移动时同步地图方位 代码: views.forEach((view) =& ...

  3. 利用snowfall.jquery.js实现爱心满屏飞

    小颖在上一篇一步一步教你用CSS画爱心中已经分享一种画爱心的方法,这次再分享一种方法用css画爱心,并利用snowfall.jquery.js实现爱心满屏飞的效果. 第一步: 利用伪元素before和 ...

  4. android3.2以上切屏禁止onCreate()

    一般切屏禁止onCreate()方法需要将activity加上属性: android:configChanges=”orientation|keyboardHidden” 但是在3.2以上就不起作用了 ...

  5. 关于LCD的分屏与切屏 Tearing effect

    详细文档(带图片):http://download.csdn.net/detail/xuehui869/5268852 1.LCM之Fmark功能 http://blog.csdn.net/zhand ...

  6. zepto.js swipe实现触屏tab菜单

    今天我们来说下zepto.js,有兴趣的朋友可以先进这个网站“http://zeptojs.com/” ,这个可以说是手机里的jquery,但是它取消了hover,加上了swipe及tap这两个触屏功 ...

  7. js 利用canvas + flv.js实现视频流 截屏 、本地下载功能实现,兼容火狐,谷歌;canvas截屏跨域问题,无音频视频流加载不显示问题

    项目:物联网监控项目----后台视频流管理(前端实现视频截屏功能) 本文就不同视频源分情况展示: 1 本地视频(项目同目录视频)截屏(canvas.getContext("2d).drawI ...

  8. 学习 JS滚轮事件(mousewheel/DOMMouseScroll)

    学习 JS滚轮事件(mousewheel/DOMMouseScroll) 1-1 滚轮事件兼容性的差异   IE,chrome,safari 浏览器都使用 onmousewheel, 只有firefo ...

  9. js秒换成天时分

    js秒换成天时分 function timeStamp( second_time ){ var time = parseInt(second_time) + "秒"; if( pa ...

随机推荐

  1. Java编程思想读书笔记_第8章

    覆盖私有方法 class Father { private void f() { System.out.println("Father::f()"); } public stati ...

  2. 类支付宝密码输入框NumberEditText(简单粗暴的定制方式)

    因为项目需要,设计了一个下图样的验证码输入框(ps:个人认为还不如直接一个EditText,用户友好度可能更好,何况这页面99.9%的用户不会使用,但是没办法,别人才是专业的设计师). 其实界面很简单 ...

  3. HTTP、HTTP1.0、HTTP1.1、HTTP2.0——笔记

    笔记来源地址:https://mp.weixin.qq.com/s/T2IErLDxbWP1a-VbRkZZHg HTTP: HTTP是WWW数据通信的基础,是应用层协议. HTTP是干什么的?用来给 ...

  4. 10.5 集合ArrayList 和 io流

    1.ArrayListToFile package day10_io_fileWrite_Read.arraylist_tofile; import java.io.BufferedWriter; i ...

  5. arx刷新图形界面

    actrTransactionManager->flushGraphics(); acedUpdateDisplay();

  6. ThinkPHP---thinkphp实用项

    [一]代码调试 (1)跟踪信息 ①简介:用于展示系统执行的相关状况,类似于快递的物流信息.ThinkPHP中默认关闭.如需使用,则通过配置项SHOW_PAGE_TRACE(显示页面跟踪)来配置. ②位 ...

  7. Navicat for MySQL(Ubuntu)过期解决方法

    推荐购买正版软件,尊重版权  [官网在这里] Navicat for MySQL(Ubuntu系统)免费版试用过期解决方法: Step1. 直接删除 /home目录下的  .navicat文件夹(64 ...

  8. 面试总结——Java高级工程师(一)

    一.无笔试题 不知道是不是职位原因还是没遇到,面试时,都不需要做笔试题,而是填张个人信息表格,或者直接面试 二.三大框架方面问题 1.Spring 事务的隔离性,并说说每个隔离性的区别 解答:spri ...

  9. ConcurrentHashMap笔记

    概览: 内部存储的数据结构为:数组+链表+红黑树,图示: 重要的属性(内部类): //存放元素的数组 transient volatile Node<K,V>[] table; //数组中 ...

  10. Python使用Flask框架,结合Highchart,搭配数据功能模块,加载 HTML 表格数据

    参考链接:https://www.highcharts.com.cn/docs/data-modules 1.javascript代码 var chart = Highcharts.chart('co ...