html中鼠标移动有下拉图片,JQuery自适应全屏图片滚动鼠标上下滑动效果代码

特效描述：JQuery 自适应全屏 图片滚动 鼠标上下滑动效果。JQuery：全屏随鼠标滑动而滚动

代码结构

1. 引入JS

2. HTML代码

$(function(){

$('body,html').animate({scrollTop:0},300);

$.cxycs.screenscroll.init({

screens:["#screen-1"],//滚动标记的数组，类似于锚点数组

timer:500,//滚动间隔，默认500毫秒，500毫秒内鼠标滚动事件不执行页面滚动

speed:500,//滚动时间，默认500毫秒，500毫秒完成页面滚动动画

mouseScrollEventOnOff:true//鼠标滚动事件，默认为true，即开启，开启后，滚动事件由插件执行，若为false，则可以提出滚动事件自己来写滚动事件

});

$("#tag div").eq(1).html(($.cxycs.screenscroll.index+1)+"/"+num);

loadimages(2);

});

var num=2;

function loadimages(i){

if (i>num) return false;

$("#tag div").eq(0).html("正在加载第"+i+"张图片...");

var img = new Image();

img.src="images/"+i+".jpg";

img.οnlοad=function(){

var html = '

';

$("#content").append(html);

$.cxycs.screenscroll.opts.screens.push("#screen-"+i);

$("#tag div").eq(0).html("已加载"+i+"张图片");

return loadimages(i+1);

}

}

function screenScrollCallback(){

$("#tag div").eq(1).html(($.cxycs.screenscroll.index+1)+"/"+num);

}