多次调用一个js达到图片滚动的效果，但每次调用的容器和图片大小都不同，怎样赋给容器一个变量以达到要求
我想要在一个页面调用多次同一个可以实现图片滚动效果的js，每个调用js的容器和实现滚动的图片大小都不相同，所以要分别给不同的容器赋予不同的宽和高，但是这个js给容器赋了一...
我想要在一个页面调用多次同一个可以实现图片滚动效果的js，每个调用js的容器和实现滚动的图片大小都不相同，所以要分别给不同的容器赋予不同的宽和高，但是这个js给容器赋了一个固定的值，这样达不到我的要求，请问一下能不能给js的这个容器赋一个变量，然后在html中分别给这个变量赋值来达到我的要求？可以的话请高手指明一二。多谢
在这里附上代码：//容器对象,滑动对象,切换数量
var SlideTrans = function(ad, slider, count, options) {
this._slider = $$(slider);
this._container = $$(ad);//容器对象
this._timer = null;//定时器
this._count = Math.abs(count);//切换数量
this._target = 0;//目标值
this._t = this._b = this._c = 0;//tween参数
var p = CurrentStyle(this._container).position;
p == "relative" || p == "absolute" || (this._container.style.position = "relative");
this._container.style.overflow = "hidden";
this._slider.style.position = "absolute";
上面是直有关容器的代码，如需其他代码 请留言，我再上传。
这里是html调用：.ad{
width:700px;
height:250px;
margin:0px 0px 10px 0px;
}
.ad img{
width:700px;
height:250px;
border:0;
vertical-align:top;
}
</style>
<div class="ad" id="idContainer2">
<ul id="idSlider2">
<li><a href="#"> <img src="未命名-2.jpg" alt="图片上传预览" /> </a></li>
<li><a href="#"> <img src="美食.jpg" alt="多级联动菜单" /> </a></li>
<li><a href="#"> <img src="丽人.jpg" alt="浮动定位提示" /> </a></li>
</ul>
<ul class="num" id="idNum">
</ul>
.ad{
width:245px;
height:245px;
margin:0px 0px 10px 0px;
}
.ad img{
width:245px;
height:245px;
border:0;
vertical-align:top;
}
</style>
<div class="ad" id="idContainer3">
<ul id="idSlider3">
<li><a href="#"> <img src="未命名-2.jpg" alt="图片上传预览" /> </a></li>
<li><a href="#"> <img src="美食.jpg" alt="多级联动菜单" /> </a></li>
<li><a href="#"> <img src="丽人.jpg" alt="浮动定位提示" /> </a></li>
</ul>
<ul class="num" id="idNum">
</ul>
这样是完全实现不了的，这样图片就全都继承了第二个定义，没有办法两个都按照自己的样式显示。请高手解决 多谢了
代码发不上了，字数太多。我问题描述的还不够清楚吗？
var SlideTrans = function(ad, slider, count, options)
这里是定义了 SlideTrans的四个值。第一个ad是 容器的值。
this._container = $$(ad);//容器对象 这里就是把容器的值定义成了 ad
这是一个定量 只能用ad，也就是在html里只能用ad作为容器，不能修改成其他的。我想问，在js里能不能不给容器一个定制，就是把这里的ad给赋一个变量，然后可以在html里给这个容器变量赋不同的值
能不能告诉我 我的这段代码应该怎么改？ 就是给他提供一个变量，然后在html里调用这个变量 就可以了 多谢了 展开
在这里附上代码：//容器对象,滑动对象,切换数量
var SlideTrans = function(ad, slider, count, options) {
this._slider = $$(slider);
this._container = $$(ad);//容器对象
this._timer = null;//定时器
this._count = Math.abs(count);//切换数量
this._target = 0;//目标值
this._t = this._b = this._c = 0;//tween参数
var p = CurrentStyle(this._container).position;
p == "relative" || p == "absolute" || (this._container.style.position = "relative");
this._container.style.overflow = "hidden";
this._slider.style.position = "absolute";
上面是直有关容器的代码，如需其他代码 请留言，我再上传。
这里是html调用：.ad{
width:700px;
height:250px;
margin:0px 0px 10px 0px;
}
.ad img{
width:700px;
height:250px;
border:0;
vertical-align:top;
}
</style>
<div class="ad" id="idContainer2">
<ul id="idSlider2">
<li><a href="#"> <img src="未命名-2.jpg" alt="图片上传预览" /> </a></li>
<li><a href="#"> <img src="美食.jpg" alt="多级联动菜单" /> </a></li>
<li><a href="#"> <img src="丽人.jpg" alt="浮动定位提示" /> </a></li>
</ul>
<ul class="num" id="idNum">
</ul>
.ad{
width:245px;
height:245px;
margin:0px 0px 10px 0px;
}
.ad img{
width:245px;
height:245px;
border:0;
vertical-align:top;
}
</style>
<div class="ad" id="idContainer3">
<ul id="idSlider3">
<li><a href="#"> <img src="未命名-2.jpg" alt="图片上传预览" /> </a></li>
<li><a href="#"> <img src="美食.jpg" alt="多级联动菜单" /> </a></li>
<li><a href="#"> <img src="丽人.jpg" alt="浮动定位提示" /> </a></li>
</ul>
<ul class="num" id="idNum">
</ul>
这样是完全实现不了的，这样图片就全都继承了第二个定义，没有办法两个都按照自己的样式显示。请高手解决 多谢了
代码发不上了，字数太多。我问题描述的还不够清楚吗？
var SlideTrans = function(ad, slider, count, options)
这里是定义了 SlideTrans的四个值。第一个ad是 容器的值。
this._container = $$(ad);//容器对象 这里就是把容器的值定义成了 ad
这是一个定量 只能用ad，也就是在html里只能用ad作为容器，不能修改成其他的。我想问，在js里能不能不给容器一个定制，就是把这里的ad给赋一个变量，然后可以在html里给这个容器变量赋不同的值
能不能告诉我 我的这段代码应该怎么改？ 就是给他提供一个变量，然后在html里调用这个变量 就可以了 多谢了 展开
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script type="text/javascript" src="http://www.suqian.cm/js/ScrollPic.js"></script>
</head>
<body>
<style type="text/css">
.pic_top div{float:left}
.pic_yi{height:80px; width:80px;padding:20px}
</style>
<div class="pic_top">
<div class="pic_left" id="LeftArr" style="height:100px; width:200px;">鼠标点击向左（left）滚动</div>
<div class="pic_center" id="divAcrollPic1" style=" height:100px; width:400px; overflow:hidden; ">
<div class="pic_yi">图片</div>
<div class="pic_yi">图片</div>
<div class="pic_yi">图片</div>
<div class="pic_yi">图片</div>
</div>
<div class="pic_right" id="RightArr" style="height:100px; width:200px;">鼠标点击向右（right）滚动</div>
</div>
<script type="text/javascript">
// 左右点击滚动开始
var scrollPic1 = new ScrollPic();
scrollPic1.scrollContId = "divAcrollPic1"; //内容容器ID
scrollPic1.arrLeftId = "LeftArr";//左箭头ID
scrollPic1.arrRightId = "RightArr"; //右箭头ID
scrollPic1.frameWidth = 400;//显示框宽度
scrollPic1.pageWidth = 100; //翻页宽度
scrollPic1.speed = 10; //移动速度(单位毫秒，越小越快)
scrollPic1.space = 10; //每次移动像素(单位px，越大越快)
scrollPic1.autoPlay = false; //自动播放
scrollPic1.autoPlayTime = 3; //自动播放间隔时间(秒)
scrollPic1.initialize(); //初始化
// 左右点击滚动结束
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script type="text/javascript" src="http://www.suqian.cm/js/ScrollPic.js"></script>
</head>
<body>
<style type="text/css">
.pic_top div{float:left}
.pic_yi{height:80px; width:80px;padding:20px}
</style>
<div class="pic_top">
<div class="pic_left" id="LeftArr" style="height:100px; width:200px;">鼠标点击向左（left）滚动</div>
<div class="pic_center" id="divAcrollPic1" style=" height:100px; width:400px; overflow:hidden; ">
<div class="pic_yi">图片</div>
<div class="pic_yi">图片</div>
<div class="pic_yi">图片</div>
<div class="pic_yi">图片</div>
</div>
<div class="pic_right" id="RightArr" style="height:100px; width:200px;">鼠标点击向右（right）滚动</div>
</div>
<script type="text/javascript">
// 左右点击滚动开始
var scrollPic1 = new ScrollPic();
scrollPic1.scrollContId = "divAcrollPic1"; //内容容器ID
scrollPic1.arrLeftId = "LeftArr";//左箭头ID
scrollPic1.arrRightId = "RightArr"; //右箭头ID
scrollPic1.frameWidth = 400;//显示框宽度
scrollPic1.pageWidth = 100; //翻页宽度
scrollPic1.speed = 10; //移动速度(单位毫秒，越小越快)
scrollPic1.space = 10; //每次移动像素(单位px，越大越快)
scrollPic1.autoPlay = false; //自动播放
scrollPic1.autoPlayTime = 3; //自动播放间隔时间(秒)
scrollPic1.initialize(); //初始化
// 左右点击滚动结束
</script>
</body>
</html>
更多追问追答
追问
我想要的是自动滚动，不是点击滚动。能不能告诉我 我的这段代码应该怎么改？ 就是给他提供一个变量，然后在html里调用这个变量 就可以了 多谢了
追答
留下邮箱，发给你
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
试试这个图片切换
有12345数字一起切换
鼠标点一下数字会变换到另一张图片，不点就会自动换
里面有教程和源码
参考资料： http://www.blueidea.com/common/shoutbox/redir.asp?5=g&id=10895
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
一般用js做都是准备1个空容器实现头尾相接，你从这个方面考虑一下
追问
不好意思 这个js不是我写的，我也不懂js，您知道改怎么改的话 可以指点一下吗
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
