Question

关于CSS图片滚动效果

下面这一段，我想修改图片大小，但是滚动时老是不匹配，不知道是不是因为“banner a.btn_prev:hover { background-position:-200px -350px; }“这个的原因，就解释那些-350px是什么作用，怎么修改
.banner { position:relative; width:790px; height:320px; overflow:hidden; margin:10px auto; background:#FFF url(../images/kakaFoucs_bg.gif) no-repeat 0 0; }
.banner_pic { position:relative; width:630px; height:210px; overflow:hidden; margin:35px auto 0; }
.banner_pic ul { position:absolute; top:0; left:0; width:99999px; height:235px; }
.banner_pic ul li { float:left; width:630px; }
.banner a.btn_prev, .banner a.btn_next { display:block; width:30px; height:55px; overflow:hidden; margin-top:100px; background-image:url(../images/kakaFoucs_bg.gif); text-indent:-9999px; outline:none; hide-focus:expression(this.hideFocus=true); }
.banner a.btn_prev { float:left; margin-left:2px!important; margin-left:1px; background-position:0 -350px; }
.banner a.btn_next { float:right; margin-right:2px!important; margin-right:1px; background-position:-100px -350px;}
.banner a.btn_prev:hover { background-position:-200px -350px; }
.banner a.btn_next:hover { background-position:-300px -350px; }
.banner_info { position:absolute; top:255px; left:130px; width:430px; height:45px; overflow:hidden; }
.banner_info li{ display:none; }
.banner_info li.current { display:block; }
.banner_info li h4 { height:20px; overflow:hidden; }
.banner_info li h4 a { color:#666; font-size:14px; }
.banner_info li .ext, .banner_info li .ext a { color:#999; }
span.pipe { padding:0 6px;}

Answer 1

banner a.btn_prev:hover { background-position:-200px -350px; }
设置的是banner上向左的按钮在鼠标经过时的背景图像的位置
-200px是x轴的坐标，-350px是y轴的坐标

你要修改的图片的大小，应该是修改.banner_pic ul li里的width:630px
这个参数修改好以后再适当修改
.banner_pic 里的width和height
.banner_pic ul 里的height
应该就能达到目的

追问

问题在于，图片大小修改后，移动的时候移动的量也要相应修改，这里我就不会弄了

追答

那个要改js

追问

那段js好长好长。。。