此作品是一款非常酷的jquery特效,配合jquery动画插件jquery.easing一起实现了猎豹浏览器4.0版欢迎页面滑动特效,里面包括了很多实用的功能,滑动特效、鼠标滑轮效果、动画效果等。。。
鼠标滑动事件核心代码如下:
//鼠标滚动事件
var shubiao=true;
var wheel = function(event) {
var delta = 0;
if (!event)
event = window.event;
if (event.wheelDelta) {
delta = event.wheelDelta / 120;
} else if (event.detail) {
delta = -event.detail / 3;
}
if (delta) handle(delta);
if (event.preventDefault) event.preventDefault();
event.returnValue = false;
}
if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);
document.onmousewheel = wheel;
var $f=true;
var handle = function(delta) {
if(!shubiao) return;
shubiao=false;
var random_num = Math.floor((Math.random() * 100) + 50);
if (delta < 0) {
PicWheelScroll(1);
$f=false;
//console.log("鼠标滑轮向下滚动:" + delta + "次!"); // 1
return false;
} else {
$f=true;
PicWheelScroll(0);
//console.log("鼠标滑轮向上滚动:" + delta + "次!"); // -1
return false;
}
}
$(".ac").each(function(i){
$(this).click(function(){
$(".ac").removeClass("active");
$(".ac").eq(i).addClass("active");
var num=i+1;
if(num=="4") $("#btntop").hide();
else $("#btntop").show();
gotoAnchor($(".a"+num));
getAnchroFun(num);
})
})
效果如下:
如果您觉得本作品对您的学习有所帮助:
关键字:
滑动插件 进度条 滚动条特效 时间轴 Timeline 滚动条插件 实用特效 置顶特效