用javascript实现图片从下到上轮播
展开全部
<div>
<MARQUEE onmouseover=this.stop() onmouseout=this.start() scrollAmount=3 scrollDelay=50 direction=up height="99%" style="padding: 246px 0pt;">
<ul >
<li><img src="imgs/goods/goods_1_20131012103829_2.jpg" width="150" height="50"/></li>
<li><img src="imgs/goods/goods_1_20131012105644_2.jpg" width="150" height="50"/></li>
<li><img src="imgs/goods/goods_1_20131012111143_2.jpg" width="150" height="50"/></li>
<li><img src="imgs/goods/goods_1_20131012113433_2.jpg" width="150" height="50"/></li>
</ul>
</MARQUEE>
</div>
<MARQUEE onmouseover=this.stop() onmouseout=this.start() scrollAmount=3 scrollDelay=50 direction=up height="99%" style="padding: 246px 0pt;">
<ul >
<li><img src="imgs/goods/goods_1_20131012103829_2.jpg" width="150" height="50"/></li>
<li><img src="imgs/goods/goods_1_20131012105644_2.jpg" width="150" height="50"/></li>
<li><img src="imgs/goods/goods_1_20131012111143_2.jpg" width="150" height="50"/></li>
<li><img src="imgs/goods/goods_1_20131012113433_2.jpg" width="150" height="50"/></li>
</ul>
</MARQUEE>
</div>
更多追问追答
追问
这个不行 要实现图片在一个大的div里轮播 你的做法 会让高度小很多 不好看
追答
你可以自行调整div的宽高啊；这个不行的话就只能手写js实现了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!doctype html>
<title>javascript向上滚动</title>
<meta charset="utf-8"/>
<style type="text/css">
h1 {
font:400 16px/1 "Microsoft YaHei",KaiTi_GB2312,SimSun
}
#marquee {
position:relative;
height:300px;
width:200px;
overflow:hidden;
border:10px solid #369;
}
#marquee img {
display:block;
}
#marquee dd {
margin:0px;
padding:0px;
}
</style>
<script type="text/javascript">
var Marquee = function(id){
try{document.execCommand("BackgroundImageCache", false, true);}catch(e){};
var container = document.getElementById(id),
original = container.getElementsByTagName("dt")[0],
clone = container.getElementsByTagName("dd")[0],
speed = arguments[1] || 10;
clone.innerHTML=original.innerHTML;
var rolling = function(){
if(container.scrollTop == clone.offsetTop){
container.scrollTop = 0;
}else{
container.scrollTop++;
}
}
var timer = setInterval(rolling,speed)//设置定时器
container.onmouseover=function() {clearInterval(timer)}//鼠标移到marquee上时，清除定时器，停止滚动
container.onmouseout=function() {timer=setInterval(rolling,speed)}//鼠标移开时重设定时器
}
window.onload = function(){
Marquee("marquee");
}
</script>
<h1>javascript无缝滚动(向上滚动)</h1>
<dl id="marquee">
<dt>
<img src="o_s017.jpg"/>
<img src="o_s018.jpg"/>
<img src="o_s019.jpg"/>
<img src="o_s020.jpg"/>
<img src="o_s021.jpg"/>
<img src="o_s022.jpg"/>
<img src="o_s023.jpg"/>
</dt>
<dd></dd>
</dl>
自己找点图片添加上去，看看就明白了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
setInterval,offsetTop,innerHTML,UL的宽度，注意下这四点，用JS实现，自己再想想，
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
直接给你个文件吧！
追问
好的 多谢
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
