第一步：下载jquery-mousewheel插件
第二步：复制以下代码做测试，打开日志看效果
jQuery(function($) {
$('#nav')
bind('mousewheel', function(event, delta) {
var dir = delta > 0 'Up' : 'Down';
if (dir == 'Up') {
consolelog(“向上滚动， (“向下滚动， >
使用scrollby(x轴,y轴)方法就可以使文档对象滚动到距离浏览器窗口坐标的指定位置上
注意事项
文档对象可以看做是网页所有可见内容的存储容器,网页所有可见内容称为页面
网页x轴坐标与数学一样,但是y轴坐标是相反的,向下是正数,向上是负数
页面移动出去的距离不能和滚动条移动出去的距离对等
滚动条移动出去多少像素才能等达到页面要移动出去的像素是根据整个页面的尺寸比例计算的
这个文档对象移动出去的距离在坐标系上是一定是负数,但是我们要用正数来表示他距离浏览器窗口0,0坐标的距离
这个方法移动的是文档对象和浏览器存储文档对象的窗口0,0位置坐标的距离,绝不是滚动条和文档对象的距离,
移动出去的距离就是文档对象不可见部分内容和浏览器存储文档对象的窗口0,0坐标的距离
这个方法使用scroll命名只是因为文档对象移动出去的距离需要滚动条滚动才能达到效果,便于记忆而已
scrollby()方法是window对象下的方法,document对象及其子对象没有该方法
document对象及其子对象如果要获取或设置元素内部内容滚动出去的距离,请使用scrollTop和scrollLeft, 注意该方法是计算的不可见部分移动出去的内容顶端距离容器的距离是从容器内边距开始计算,而不是边框
使用scrollby()必须存在滚动条,且有一定的高度才能看出方法的效果
如果是朝左翻页，就把当前页朝左偏移100%的宽度，让下一页同样朝左偏移100%宽度。以下是代码部分：<html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> banner{ width:300px; height:250px; position: relative; z-index: 100; background: skyblue; margin:100px auto; overflow:hidden ; } banner first{ left:0; } banner a{ width: 100%; height: 100%; position: absolute; display:block; top:0; left:100%; } banner a img{ width: 100%; height: 100%; } banner pre{ position: absolute; left:0; top:120px; background: gray; width:30px; height:30px; border-radius: 30px; line-height: 30px; text-align: center; opacity: 04; z-index: 1000; cursor: pointer; } banner next{ position: absolute; right:0; top:120px; background: gray; width:30px; height:30px; border-radius: 30px; line-height: 30px; text-align: center; opacity: 04; z-index: 1000; cursor: pointer; } 楼主的这个代码我看不太懂
是经过压缩的
楼主看下这个代码，经过修改应该可以的
><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 401 Transitional//EN" ">var camera;
var isDown;
windowonload = function () {
//滚动条索取对象（这里使用整个页面，确保页面有滚动条）
camera = documentbody;
isDown = true; //默认向下
c = setInterval(gundong, 10);
}
var gundong = function () {
if (isDown) {
camerascrollTop++; //下降
//如果滚动条超过100的话，就往上
//可以修改这个条件，作为折返的前提
if (camerascrollTop > 100) {
isDown = false;
}
} else {
camerascrollTop--; //上升
//到达顶部的话，就下降
if (camerascrollTop == 0) {
isDown = true;
}
}
}<script language="javascript" type="text/javascript">
//滚动展示 Start
var counts = 4;
//大图//
img1 = new Image();
img1src = 'images/1jpg';
img2 = new Image();
img2src = 'images/2jpg';
img3 = new Image();
img3src = 'images/3jpg';
img4 = new Image();
img4src = 'images/4jpg';
var smallImg = new Array();
//小图
smallImg[0] = 'images/index_adb1gif';
smallImg[1] = 'images/index_adb2gif';
smallImg[2] = 'images/index_adb3gif';
smallImg[3] = 'images/index_adb4gif';
//链接地址
url1 = new Image();
url1src = ' >完全用CSS控制就可以了，页面在滚动，给这个DIV设置position:fixed;那么页面不管怎么滚动，这个DIV是中在顶端
解决方案二：
显示合作div absolute定位，判断滚动到div位置的时候设置position为fixed，同时设置top为0
<div style="height:500px;background:#999"></div>
<div id="fixedMenu" style="background:#eee;width:100%;">我是菜单，我到页头会固定</div>
<div style="height:900px;background:#999"></div>
<script type="text/javascript" src=">
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）