1. 程式人生 > >jquery 響應不同瀏覽器 滑鼠滾輪上下滾動事件 相對的操作

jquery 響應不同瀏覽器 滑鼠滾輪上下滾動事件 相對的操作

/*********************** 
* 函式:繫結滑鼠滾輪上下滾動事件 相對的操作
* 引數:event 
* 返回:滾輪方向 1:向上 -1:向下 
* 		FireFox 向上滑動detail值為—3,向下為3;
* 		Ie      向上滑動wheelDelta 值為120,向下為-120	
*************************/ 
var scrollFunc=function(e){ 
    //var direct=0; 
    e=e || window.event; 
     
    if(e.wheelDelta){//IE/Opera/Chrome 
    	if(e.wheelDelta==120)
		{
			//向上滾動事件
		}
		else
		{		
//向下滾動事件
} }else if(e.detail){//Firefox if(e.detail==-3) { //向上滾動事件
} else { //向下滾動事件
} } //ScrollText(direct); } /*註冊事件*/ 
if(document.addEventListener)
{ document.addEventListener('DOMMouseScroll',scrollFunc,false); }//W3C
 window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

相關推薦

jquery 響應不同瀏覽器 滑鼠滾輪上下滾動事件 相對操作

/*********************** * 函式:繫結滑鼠滾輪上下滾動事件 相對的操作 * 引數:event * 返回:滾輪方向 1:向上 -1:向下 * FireFox 向上滑動

解決mui scoll真機除錯滑鼠滾輪滾動,而手機不能滾動問題

直接註釋掉之前寫的滾動條初始化就ok了 // mui.init(); // (function($) { // $(".mui-scroll-wrapper").scroll({ // bounce: true, //滾動條

ListBox攔截滾輪ScrollViewer滾動事件

<ScrollViewer > <ListBox x:Name="CommentListBox" > </ListBox> </<ScrollViewer > 滾輪影響可修

為什麼jQuery不能監聽body的滾動事件呢?

有如下測試,發現不管用: $(document.body).scroll(function (e) { alert('我滾動了'); }); 查閱資料發現: 這跟jQuery貌似沒什麼關係,跟BOM和DOM是有關係

js監聽html頁面的上下滾動事件

最近在一個專案中,在寫前端頁面的時候,想像以前做Android時在頁面時刻監聽上下滾動的事件,查詢資料發現由滑鼠或類似使用者動作觸發的事件有以下圖示: 不多說了,直接上程式碼了,經過測試可以使用: <!DOCTYPE html> <

Delphi 攔截滾輪事件響應滾輪上下滾動

dct creat www 滾動 .cn ont str use graphics unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls,

針對不同瀏覽器事件繫結以及滑鼠滾輪事件

前段時間在看《JavaScript高階程式設計》第十三章-事件, 還沒看完, 只是看到裡面的一些內容覺得在這裡做一個記錄和總結會比較好. 首先先來講解一下繫結事件一共有幾種方式以及他們的特點和瀏覽器的相容性 一. DOM0級事件處理程式 所謂的DOM0級事件處理程式,

監測滑鼠滾輪上下滾動來實現導航條顯示隱藏

$(document).on("mousewheel DOMMouseScroll", function (e) {     var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDe

jQuery 3D圓盤旋轉焦點圖 支援滑鼠滾輪

之前我們分享過很多炫酷實用的jQuery焦點圖外掛了,今天介紹的這款jQuery焦點圖非常特別,所有圖片圍成一個圓圈,組成一個立體視覺的圓盤,並且可以旋轉選擇圓盤中的圖片。另外,這款jQuery 3D圓盤旋轉焦點圖外掛還支援滑鼠滾輪,可以讓你更方便地瀏覽圖片。 線上演示原始碼下載 接下來分析一下實現這

使用jQuery控制頁面滾動上下滾動

1.向上滾動  $(this).animate({ scrollTop: "-=50" }, 1000); 2.向下滾動   $(this).animate({ scrollTop: "+=50" }, 1000); 引數解讀

jQuery實現的上下滾動公告欄詳細講解

之前做專案的時候,一直都想著做一個上下滾動的公告欄,作為展示網站的最新公告資訊,因為剛開始自己的思路並不是太清晰,在網上找了很多的原始碼,但是卻發現都不能讓自己滿意,有的還會出現一些小問題,比如,有時候公告上下滾動的時候,兩條公告會重疊在一起。最後我還是決定自己寫一個上下滾動的公告欄。 jQuery實現上下

jQuery fullpage.js 全屏滾動外掛取消滑鼠滾動事件,點選選單欄定位顯示頁面。

問題:專案中遇到一個頁面,使用了全屏滾動外掛,如下有4屏畫面。使用了 fullpage.js,現在想要取消通過滑鼠滑輪滾動來定位頁面的功能,只通過點選左側選單欄來實現的定位頁面。   (此處前提條件是,原來的滑鼠事件有效,同時點選左側選單欄也能實現定位de)

jQuery 判斷頁面上下滾動

set con else ons lse 滾動 this window query var t = 0, b = 0; $(window).scroll(function(){ t = $(this).scrollTop(); if(b <

根據不同瀏覽器選擇jquery版本

對於1.9x 和 2.x 版,如果你要支援IE 6/7/8,就選擇 1.9 版;反之隨便選,1.9 和 2.0 版皆可。你也可以使用下面的程式碼: <!DOCTYPE html> <html> <head> <meta charse

解決input number類型上下滾動 禁用滾輪事件

efault 類型 prop cancel input def clas gin val 1.去掉input在type="number"時的上下箭頭    <style> input::-webkit-outer-spin-button,input::

滑鼠滾輪在WINDOWS系統中也和MAC一樣滾動(WIN系統滑鼠滾輪反向)

用習慣MAC系統偶爾要用用WINDOWS系統,或者由於各種原因總之時不時需要由MAC轉向WIN系統或同時需要兩個平臺機器上倒騰來倒騰去的同學,一般來說最痛苦的就是滑鼠滾輪方向不一致。 基本上我們知道蘋果系統裡到是可以把滑鼠滾輪方向設定成和WINDOWS一樣的方向,但是那就 觸控板的“上、下”方向也

js/jquery隱藏/顯示瀏覽器滾動

//隱藏瀏覽器滾動條document.body.parentNode.style.overflowY = "hidden";$("body").parent().css("overflow-y","hidden");//顯示瀏覽器滾動條document.body.parent

div隨滾動上下滾動,onscroll事件相容IE、火狐、谷歌瀏覽器

<script type="text/javascript"> var scrollFunction=function(e){ e=e || window.event; var _h = document.documentElemen

重寫滑鼠滾輪事件阻止滾動條冒泡

原文地址 遇到一個問題,頁面和子頁面同時存在滾動條,在滑鼠滾輪時候,會衝突:子頁滾動條到頂部或者底部時候會繼續冒泡,去滾動父節點的滾動條。 解決這個問題,必需要攔截滑鼠滾輪事件,重寫滾動事件,這時候又出現了煩人的瀏覽器相容問題: 1、不同瀏覽器標滾輪事件不一樣:FF下是DO

文字無縫滾動jQuery上下滾動js效果程式碼

HTML程式碼 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> &