/** Event handler for mouse wheel event.
*鼠标滚动事件
*/
var wheel = function(event) {
var delta = 0;
if (!event) /* For IE. */
event = window.event;
if (event.wheelDelta) { /* IE/Opera. */
delta = event.wheelDelta / 120;
} else if (event.detail) {
/** Mozilla case. */
/** In Mozilla, sign of delta is different than in IE.
* Also, delta is multiple of 3.
*/
delta = -event.detail / 3;
}
/** If delta is nonzero, handle it.
* Basically, delta is now positive if wheel was scrolled up,
* and negative, if wheel was scrolled down.
*/
if (delta)
handle(delta);
/** Prevent default actions caused by mouse wheel.
* That might be ugly, but we handle scrolls somehow
* anyway, so don't bother here..
*/
if (event.preventDefault)
event.preventDefault();
event.returnValue = false;
}
/** Initialization code.
* If you use your own event management code, change it as required.
*/
if (window.addEventListener) {
/** DOMMouseScroll is for mozilla. */
window.addEventListener('DOMMouseScroll', wheel, false);
}
/** IE/Opera. */
window.onmousewheel = document.onmousewheel = wheel;
/** This is high-level function.
* It must react to delta being more/less than zero.
*/
var handle = function(delta) {
var random_num = Math.floor((Math.random() * 100) + 50);
if (delta < 0) {
// alert("鼠标滑轮向下滚动:" + delta + "次!"); // 1
$("btn_next_pic").onclick(random_num);
return;
} else {
// alert("鼠标滑轮向上滚动:" + delta + "次!"); // -1
$("btn_last_pic").onclick(random_num);
return;
}
}
- 浏览: 38569 次
- 性别:
- 来自: 北京
最新评论
-
一湖碧波:
very good
级联菜单,省市级联菜单
jQuery鼠标滚动事件
- 博客分类:
- jquery
相关推荐
本项目"jQuery鼠标滚动事件动画 jQuery鼠标滚动事件动画宣传页面.zip"是利用jQuery实现的一种交互效果,特别是针对鼠标滚动事件的处理,用于创建动态且吸引人的宣传页面。这个压缩包包含了一个基于HTML5、CSS和...
本知识点将深入探讨如何利用jQuery实现鼠标滚动事件的动画效果。首先,我们来理解什么是鼠标滚动事件。 鼠标滚动事件是用户操作浏览器时触发的一种事件,通常发生在用户滚动页面时。在jQuery中,我们可以使用`$...
本篇将详细介绍如何使用jQuery和原生JavaScript实现鼠标滚轮事件的监听。 一、jQuery监听鼠标滚轮事件 jQuery库提供了一种简洁的方式来处理DOM元素上的事件,包括滚轮事件。要监听滚轮事件,可以使用`$(element)....
jQuery鼠标滚动手风琴 jQuery鼠标滚动手风琴代码下载.zip
本项目“jQuery支持鼠标滚动的时间轴”是利用jQuery的强大功能,结合特定的插件,来实现一个动态的时间轴效果,使得用户可以通过鼠标滚动浏览时间轴上的各个事件。 首先,我们需要引入jQuery库本身,它为我们的页面...
在"perfect scrollbar jQuery鼠标滚轮滚动事件"中,我们将探讨如何利用这个插件来处理鼠标的滚轮滚动事件,以及它与jQuery的交互。 首先,我们需要了解Perfect Scrollbar的基本使用方法。在引入jQuery库和Perfect ...
"jQuery鼠标滚动列表切换代码"就是一个典型的应用,它利用jQuery库实现了文字列表在鼠标滚动时进行左右滑动切换的效果。这种效果在新闻网站、产品展示页面等场合非常常见,能够使用户在浏览过程中更加流畅地获取信息...
在这个特效中,jQuery负责监听鼠标滚动事件并触发相应的动画。 countup.js是这个特效的核心,它是一个轻量级的JavaScript插件,专门用于生成动态的计数效果。它能够将任何数字从一个值平滑地过渡到另一个值,非常...
在给定的“jquery鼠标滚轮事件支持插件”中,我们关注的是如何利用jQuery扩展来处理鼠标的滚轮事件。这个插件允许开发者监听和响应用户滚动鼠标的滚轮,从而在网页上实现更加动态和交互的功能。 标题中的“jquery...
"jQuery鼠标滚轮事件"是一个非常实用的功能,它允许我们监听并响应用户使用鼠标滚轮时的操作,以此来实现诸如页面滚动、图片缩放等丰富的交互效果。在本文中,我们将深入探讨jQuery中关于鼠标滚轮事件的知识点。 ...
标题 "jquery鼠标滚动全屏页面滚动切换效果" 描述了一个使用jQuery实现的网页交互功能,它使得用户在鼠标滚动时,全屏页面能够平滑地切换内容。这种效果常见于现代网页设计中,用于创建引人入胜的用户体验,尤其适用...
《jQuery鼠标滚动图片:打造动态视觉盛宴》 在网页设计中,吸引用户的注意力并提供良好的交互体验至关重要。jQuery鼠标滚动图片技术就是一种实现这一目标的有效手段。它将传统的静态图片展示转变为动态的、响应用户...
《jQuery鼠标滚动全屏切换预览特效》 在网页设计中,吸引用户的注意力并提供流畅的用户体验至关重要。jQuery作为一种强大的JavaScript库,为开发者提供了丰富的工具和功能,使得创建动态、交互性极强的网页效果变得...
三、鼠标滚动事件 在jQuery中,可以使用`$(window).scroll()`函数监听用户的滚动事件。当用户滚动鼠标时,这个函数会被调用,从而触发相应的动画效果。结合CSS3的transform属性,可以控制元素的旋转和平移,实现3D...
"jQuery鼠标滚动隐藏顶部标题"是一个巧妙的JS特效,它能够提升网站的视觉效果和交互性。这个特效的核心是利用jQuery库来实现页面滚动时标题的动态隐藏与显示,为用户提供一种更为流畅的浏览体验。 首先,我们来理解...
【标题】"鼠标滚动事件动画.zip"所包含的知识点主要集中在JavaScript(JS)与jQuery库的应用上,特别是针对用户交互的响应式设计和动画效果的实现。在这个项目中,开发者利用了jQuery的事件监听和CSS3的动画特性,...
3. **鼠标滚动事件**:在事件处理函数中,`event.originalEvent.wheelDelta`或`event.deltaY`可获取滚动的幅度,正负值表示向上/向下滚动。 4. **CSS3变换**:`transform: scale(x)`用于缩放元素,其中`x`是缩放...
jQuery鼠标滚动全屏切换预览特效结合了JavaScript库jQuery和fullPage.js插件,实现了通过鼠标滚动来无缝过渡到下一个全屏页面的效果。这种效果可以极大地提升网站的视觉吸引力,同时也增强了用户的交互性。 首先,...
"jQuery鼠标滚动控制全屏页面滚动"是一个利用jQuery和pageswitch插件实现的解决方案,它允许用户通过鼠标滚动来平滑地切换全屏页面内容。下面将详细介绍这个技术及其相关知识点。 首先,jQuery是一个广泛使用的...