87,904
社区成员
发帖
与我相关
我的任务
分享Js的问题-----(图片上下翻滚)
请问一下!各位大哥大姐！小女子才毕业不久。现在也没有什么分！
是想实现图片上下翻滚,鼠标放上去，就停止滚动。还要如图片滚到第三副图片，下面关于第三幅图片的颜色也要变光亮！
可以在我以下的代码中改吗？ 我下面的代码只能实现上下翻滚...
MSN:zhtgreen@hotmail.com
是想实现图片上下翻滚,鼠标放上去，就停止滚动。还要如图片滚到第三副图片，下面关于第三幅图片的颜色也要变光亮！
可以在我以下的代码中改吗？ 我下面的代码只能实现上下翻滚...
MSN:zhtgreen@hotmail.com
...全文
请发表友善的回复…
发表回复
caiying2009 2009-03-24
- 打赏
- 举报
<html>
<head>
<title>精华图片 </title>
<style>
*{font-size:12px;}
img {border:0;}
#daily{background:#fef;padding:5px;padding-top:0px;}
</style>
</head> <body>
<div id="daily">
<h1> </h1>
<div id="makewing" style="overflow:hidden;height:148px;border:0px;padding:0px;">
<table cellpadding="0" cellspacing="3" border="0" style="padding:0;" >
<tr height="148" id="tr1" >
<td>
<a class="proImg01" href="/ProductInfo_30800064_001.html">
<img src="http://tucoo.com/icon/Yazoo%20smilies/s/Crazy.png" alt="母子花器(大)" width="130" height="130" />
</a>
</td>
<td>
<ul>
<li> <img src="/images/dailyNo1.gif" alt="海上网,抢购时间" /> </li>
<li>母子花器(大) </li>
<li>本店售价： <span class="impor">￥159.00 </span> </li>
<li id="dailyBuyBut"> <a href="/ProductInfo_30800064_001.html"> <img src="images/but-0001.gif" alt="抢购" /> </a> </li>
</ul>
</td>
</tr>
<tr height="148" id="tr2">
<td>
<a class="proImg01" href="/ProductInfo_10800001_300.html">
<img src="http://tucoo.com/icon/Yazoo%20smilies/s/Wow.png" alt="休闲自我二用包" width="130" height="130" />
</a>
</td>
<td >
<ul>
<li> <img src="/images/dailyNo42.gif" alt="海上网,抢购时间" /> </li>
<li>休闲自我二用包 </li>
<li>本店售价： <span class="impor">￥139.00 </span> </li>
<li id="Li1"> <a href="/ProductInfo_10800001_300.html"> <img src="images/but-0001.gif" alt="抢购" /> </a> </li>
</ul>
</td>
</tr>
<tr height="148" id="tr3">
<td>
<a class="proImg01" href="/ProductInfo_10900066_312.html">
<img src="http://tucoo.com/icon/Yazoo%20smilies/s/Tongue.png" alt="未来主义时尚手镯" width="130" height="130" />
</a>
</td>
<td>
<ul>
<li> <img src="/images/dailyNo3.gif" alt="海上网,抢购时间" /> </li>
<li>未来主义时尚手镯 </li>
<li>本店售价： <span class="impor">￥28.00 </span> </li>
<li id="Li2"> <a href="/ProductInfo_10900066_312.html"> <img src="images/but-0001.gif" alt="抢购" /> </a> </li>
</ul>
</td>
</tr>
</table>
</div>
<div id="indTopic01"> <a name="aresult" href="#" style="color:red;">№1 母子花器(大) </a> </div>
<div id="indTopic02"> <a name="aresult" href="#" >№2 休闲自我二用包 </a> </div>
<div id="indTopic03"> <a name="aresult" href="#">№3 未来主义时尚手镯 </a> </div>
</div>
</body>
<script language="JavaScript" type="text/javascript">
var obj_marquee;
var marquee_spd = 4000;
var step_c = 0;
var lightLink=1;
var caiying2009=1;
function marquee_init() {
obj_marquee = document.getElementById("makewing");
var obj_unit = obj_marquee.firstChild;
var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight);
for(var i=0; i <n; i++) obj_marquee.appendChild(obj_unit.cloneNode(true));
setInterval(function(){nextInf()}, marquee_spd);
var InfObj=document.getElementById("daily");
InfObj.onmouseover=function(){caiying2009=0}
InfObj.onmouseout=function(){caiying2009=1}
}
function nextInf(){
if (caiying2009){
step_c = 0;
lightLink++
if (lightLink>3)lightLink=1
for (var i=1;i<4;i++)
document.getElementById("indTopic0"+i).getElementsByTagName("a")[0].style.color="#000"
document.getElementById("indTopic0"+lightLink).getElementsByTagName("a")[0].style.color="#f00"
marquee_show()
}
}
function marquee_show() {
var marquee_high = parseInt(obj_marquee.style.height);
var step = marquee_high/10;
if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) {
obj_marquee.scrollTop = 0;
marquee_show();
return;
}
obj_marquee.scrollTop += step;
if(step_c++ < 10) setTimeout("marquee_show()", 30);
return;
}
window.onload=marquee_init;
</script>
</html>
zht_green 2009-03-24
- 打赏
- 举报
IBM_hoojo
很够意思！ 谢谢哦！
很够意思！ 谢谢哦！
avengercf 2009-03-24
- 打赏
- 举报
我 的BOLG里 有你要的JS类，只是光亮效果需要你 另外写JS去 做 设置哪个是 很简单的 东西
hoojo 2009-03-24
- 打赏
- 举报
<div id=demo style="overflow: hidden; height: 600; width: 180; background: #214984; color: #ffffff">
<div id=demo1>
<!-- 定义图片 -->
这里放图片哦 ！！！ </div>
<div id=demo2></div>
</div>
<script>
var speed = 30;
demo2.innerHTML = demo1.innerHTML;
demo.scrollTop = demo.scrollHeight;
function Marquee() {
if (demo1.offsetTop - demo.scrollTop >= 0)
demo.scrollTop += demo2.offsetHeight;
else {
demo.scrollTop--;
}
}
var MyMar = setInterval(Marquee, speed);
demo.onmouseover = function() {
clearInterval(MyMar)
}
demo.onmouseout = function() {
MyMar = setInterval(Marquee, speed);
}
</script>
一定行，这个
试试看，兄弟
够意思了吧
^_*
zht_green 2009-03-24
- 打赏
- 举报
<html>
<head>
<title>精华图片</title>
</head><body>
<div id="daily">
<h1></h1>
<div id="makewing" style="overflow:hidden;height:148px;border:0px;padding:0px;">
<table cellpadding="0" cellspacing="0" border="0" style="padding:0px;" >
<tr height="148" id="tr1" >
<td>
<a class="proImg01" href="/ProductInfo_30800064_001.html">
<img src="/temp/00011.jpg" alt="母子花器(大)" width="130" height="130" />
</a>
</td>
<td>
<ul>
<li><img src="/images/dailyNo1.gif" alt="海上网,抢购时间" /></li>
<li>母子花器(大)</li>
<li>本店售价：<span class="impor">￥159.00</span></li>
<li id="dailyBuyBut"><a href="/ProductInfo_30800064_001.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
</ul>
</td>
</tr>
<tr height="148" id="tr2">
<td>
<a class="proImg01" href="/ProductInfo_10800001_300.html">
<img src="/temp/00012.jpg" alt="休闲自我二用包" width="130" height="130" />
</a>
</td>
<td >
<ul>
<li><img src="/images/dailyNo42.gif" alt="海上网,抢购时间" /></li>
<li>休闲自我二用包</li>
<li>本店售价：<span class="impor">￥139.00</span></li>
<li id="Li1"><a href="/ProductInfo_10800001_300.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
</ul>
</td>
</tr>
<tr height="148" id="tr3">
<td>
<a class="proImg01" href="/ProductInfo_10900066_312.html">
<img src="/temp/00013.jpg" alt="未来主义时尚手镯" width="130" height="130" />
</a>
</td>
<td>
<ul>
<li><img src="/images/dailyNo3.gif" alt="海上网,抢购时间" /></li>
<li>未来主义时尚手镯</li>
<li>本店售价：<span class="impor">￥28.00</span></li>
<li id="Li2"><a href="/ProductInfo_10900066_312.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
</ul>
</td>
</tr>
</table>
</div>
<div id="indTopic01"><a name="aresult" href="#" style="color:red;">№1 母子花器(大)</a></div>
<div id="indTopic02"><a name="aresult" href="#" >№2 休闲自我二用包</a></div>
<div id="indTopic03"><a name="aresult" href="#">№3 未来主义时尚手镯</a></div>
</div>
</body>
<script language="JavaScript" type="text/javascript">
var obj_marquee;
var marquee_spd = 4000;
var step_c = 0;
function marquee_init() {
obj_marquee = document.getElementById("makewing");
var obj_unit = obj_marquee.firstChild;
var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight);
for(var i=0; i<n; i++) obj_marquee.appendChild(obj_unit.cloneNode(true));
setInterval("step_c=0;setTimeout('marquee_show()',30)", marquee_spd);
return;
}
function marquee_show() {
var marquee_high = parseInt(obj_marquee.style.height);
var step = marquee_high/10;
if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) {
obj_marquee.scrollTop = 0;
marquee_show();
return;
}
obj_marquee.scrollTop += step;
if(step_c++ < 10) setTimeout("marquee_show()", 30);
return;
}
window.onload=marquee_init;
</script>
</html>
<head>
<title>精华图片</title>
</head><body>
<div id="daily">
<h1></h1>
<div id="makewing" style="overflow:hidden;height:148px;border:0px;padding:0px;">
<table cellpadding="0" cellspacing="0" border="0" style="padding:0px;" >
<tr height="148" id="tr1" >
<td>
<a class="proImg01" href="/ProductInfo_30800064_001.html">
<img src="/temp/00011.jpg" alt="母子花器(大)" width="130" height="130" />
</a>
</td>
<td>
<ul>
<li><img src="/images/dailyNo1.gif" alt="海上网,抢购时间" /></li>
<li>母子花器(大)</li>
<li>本店售价：<span class="impor">￥159.00</span></li>
<li id="dailyBuyBut"><a href="/ProductInfo_30800064_001.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
</ul>
</td>
</tr>
<tr height="148" id="tr2">
<td>
<a class="proImg01" href="/ProductInfo_10800001_300.html">
<img src="/temp/00012.jpg" alt="休闲自我二用包" width="130" height="130" />
</a>
</td>
<td >
<ul>
<li><img src="/images/dailyNo42.gif" alt="海上网,抢购时间" /></li>
<li>休闲自我二用包</li>
<li>本店售价：<span class="impor">￥139.00</span></li>
<li id="Li1"><a href="/ProductInfo_10800001_300.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
</ul>
</td>
</tr>
<tr height="148" id="tr3">
<td>
<a class="proImg01" href="/ProductInfo_10900066_312.html">
<img src="/temp/00013.jpg" alt="未来主义时尚手镯" width="130" height="130" />
</a>
</td>
<td>
<ul>
<li><img src="/images/dailyNo3.gif" alt="海上网,抢购时间" /></li>
<li>未来主义时尚手镯</li>
<li>本店售价：<span class="impor">￥28.00</span></li>
<li id="Li2"><a href="/ProductInfo_10900066_312.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
</ul>
</td>
</tr>
</table>
</div>
<div id="indTopic01"><a name="aresult" href="#" style="color:red;">№1 母子花器(大)</a></div>
<div id="indTopic02"><a name="aresult" href="#" >№2 休闲自我二用包</a></div>
<div id="indTopic03"><a name="aresult" href="#">№3 未来主义时尚手镯</a></div>
</div>
</body>
<script language="JavaScript" type="text/javascript">
var obj_marquee;
var marquee_spd = 4000;
var step_c = 0;
function marquee_init() {
obj_marquee = document.getElementById("makewing");
var obj_unit = obj_marquee.firstChild;
var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight);
for(var i=0; i<n; i++) obj_marquee.appendChild(obj_unit.cloneNode(true));
setInterval("step_c=0;setTimeout('marquee_show()',30)", marquee_spd);
return;
}
function marquee_show() {
var marquee_high = parseInt(obj_marquee.style.height);
var step = marquee_high/10;
if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) {
obj_marquee.scrollTop = 0;
marquee_show();
return;
}
obj_marquee.scrollTop += step;
if(step_c++ < 10) setTimeout("marquee_show()", 30);
return;
}
window.onload=marquee_init;
</script>
</html>
