如何写图片广告上下翻动的代码?

lictor · 发表于 2007 年 1 月 2 日 23:33:27

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有账号？注册

×

一行8 个图片,5秒钟后上翻显示另外8个图片,5秒钟后下翻显示另外8个图片,如此循环,共有5组图片,

客户要求作这样的效果,我想破头也没写出来,救命!

iyaner · 发表于 2007 年 1 月 2 日 23:35:06

flash偶就知道怎么做！java就不晓得了

waitme · 发表于 2007 年 1 月 2 日 23:36:18

呵呵。。下个JS看下。。如何实现的

wbws · 发表于 2007 年 1 月 2 日 23:36:59

看看http://bbs.163.com有个效果可以仿照的

lictor · 发表于 2007 年 1 月 2 日 23:38:03

我要找的就是JavaScript的
或者做个FLASH的能读取外部图片的？

Cn.modao · 发表于 2007 年 1 月 2 日 23:41:52

163的哪个

<div class="list">
<div class="num">
<ul>
<li><img src="http://cimg2.163.com/cnews/newimg/bbs/up.gif" alt=" " id="upbtn" style="cursor: pointer;" onclick="slideup();clearInterval(interval01);" onfocus="this.blur()" height="15" width="35"></li>
<li class="num1" id="led1">01</li>
<li class="num1" id="led2">02</li>
<li class="num2" id="led3">03</li>
<li><img src="http://cimg2.163.com/cnews/newimg/bbs/down.gif" alt=" " id="downbtn" style="cursor: pointer; display: none;" onclick="slidedown();clearInterval(interval01);" onfocus="this.blur()" height="15" width="35"></li>
</ul>
</div>
<script language="javascript">
var checkloaded=new Array();
for(i=1;i<=3;i++){
checkloaded[i]=0;
}
function checkdamie(n){
checkloaded[n]=1;
//alert(checkloaded[n])
}
</script>
<div class="picList" id="main" style="overflow: hidden; width: 470px; height: 125px; position: relative;" nowrap="true" onmouseover="clearInterval(interval01);" onmouseout="iniautoslide();">
<div id="f1" style="position: absolute; width: 470px; height: 125px; z-index: 10; left: 0px; top: 0px; display: block;">
<script>checkdamie(1);</script>
<ul>
<li><a href="http://bbs3.news.163.com/board/rep.jsp?b=photo&i=1958952"><img src="http://cimg2.163.com/cnews/2007/1/2/2007010212071236fe0.jpg" alt="网吧惊现美女作陪上网" border="0" height="80" width="130"></a>
<h5><a href="http://bbs3.news.163.com/board/rep.jsp?b=photo&i=1958952">网吧惊现美女作陪上网</a></h5>
</li>
<li><a href="http://bbs3.news.163.com/board/rep.jsp?b=photo&i=1960457"><img src="http://cimg2.163.com/cnews/2007/1/2/200701021205124851d.jpg" alt="盘点06中国十大疯子" border="0" height="80" width="130"></a>
<h5><a href="http://bbs3.news.163.com/board/rep.jsp?b=photo&i=1960457">盘点06中国十大疯子</a></h5>
</li>
<li><a href="http://bbs3.news.163.com/board/rep.jsp?b=photo&i=1956779"><img src="http://cimg2.163.com/cnews/2007/1/1/2007010111201618644.jpg" alt="北大女生PK金庸" border="0" height="80" width="130"></a>
<h5><a href="http://bbs3.news.163.com/board/rep.jsp?b=photo&i=1956779">北大女生PK金庸</a></h5>
</li>
</ul>
</div>
<div id="f2" style="display: block; position: absolute; width: 470px; height: 125px; z-index: 10; left: 0px; top: 125px;">
<script>checkdamie(2);</script>
<ul>
<li><a href="http://bbs.news.163.com/board/rep.jsp?b=mil&i=1215341"><img src="http://220.181.29.172/boardfile/banzhu/20071/20070101222659.jpg" alt="世界十大反恐怖部队" border="0" height="80" width="130"></a>
<h5><a href="http://bbs.news.163.com/board/rep.jsp?b=mil&i=1215341">世界十大反恐怖部队</a></h5>
</li>
<li><a href="http://bbs.news.163.com/board/rep.jsp?b=mil&i=1211328"><img src="http://220.181.29.172/boardfile/banzhu/20071/20070101222155.jpg" alt="中国陆海空军衔大全" border="0" height="80" width="130"></a>
<h5><a href="http://bbs.news.163.com/board/rep.jsp?b=mil&i=1211328">中国陆海空军衔大全</a></h5>
</li>
<li><a href="http://bbs.news.163.com/board/rep.jsp?b=mil&i=1214486"><img src="http://220.181.29.172/boardfile/banzhu/20071/20070101084328.jpg" alt="06年军事演习精华回顾" border="0" height="80" width="130"></a>
<h5><a href="http://bbs.news.163.com/board/rep.jsp?b=mil&i=1214486">06年军事演习精华回顾</a></h5>
</li>
</ul>
</div>
<div id="f3" style="display: block; position: absolute; width: 470px; height: 125px; z-index: 10; left: 0px; top: 250px;">
<script>checkdamie(3);</script>
<ul>
<li><a href="http://bbs6.news.163.com/board/rep.jsp?b=happy&i=1092823"><img src="http://cimg2.163.com/cnews/2007/1/2/20070102124423facca.jpg" alt="艺术品一样的女性用品" border="0" height="80" width="130"></a>
<h5><a href="http://bbs6.news.163.com/board/rep.jsp?b=happy&i=1092823">艺术品一样的女性用品</a></h5>
</li>
<li><a href="http://bbs6.news.163.com/board/rep.jsp?b=happy&i=1129887"><img src="http://cimg2.163.com/cnews/2007/1/2/2007010212425378300.jpg" alt="非常酷的书包" border="0" height="80" width="130"></a>
<h5><a href="http://bbs6.news.163.com/board/rep.jsp?b=happy&i=1129887">非常酷的书包</a></h5>
</li>
<li><a href="http://bbs6.news.163.com/board/rep.jsp?b=happy&i=1125699"><img src="http://cimg2.163.com/cnews/2007/1/1/20070101113335b27a0.jpg" alt="见到美女时的经典表情" border="0" height="80" width="130"></a>
<h5><a href="http://bbs6.news.163.com/board/rep.jsp?b=happy&i=1125699">见到美女时的经典表情</a></h5>
</li>
</ul>
</div>
</div>
<script language="JavaScript">
<!--
var currentF=1;
document.getElementById("upbtn").style.display="none";
var mainobj = document.getElementById("main");
var frameheight =125;
var scrolling=0;
var speed = 20;
function alertloading(sdirection){
scrolling=0;
if(sdirection == "down"){
currentF--;
}
else{
currentF++;
}
}
function scrolldown(f){
switch (f){
case 2:
if (mainobj.scrollTop>=frameheight){
clearInterval(inter);
mainobj.scrollTop=frameheight;
scrolling=0;
}
else{mainobj.scrollTop+=speed;}
break;
case 3:
if (mainobj.scrollTop>=frameheight*2){
mainobj.scrollTop=frameheight*2;
clearInterval(inter);
scrolling=0;
}
else{mainobj.scrollTop+=speed;}
break;
}
}
function scrollup(f){
switch (f){
case 1:
if (mainobj.scrollTop<=0){
clearInterval(inter1);
mainobj.scrollTop=0;
scrolling=0;
}
else{
mainobj.scrollTop-=speed;
}
break;
case 2:
if (mainobj.scrollTop<=frameheight){
mainobj.scrollTop=frameheight;
clearInterval(inter1);
scrolling=0;
}
else{
mainobj.scrollTop-=speed;
}
break;
}
}
function slidedown(){
if (scrolling==0){
scrolling=1;
currentF++;
obj=eval("document.getElementById('f"+currentF+"')");
obj.style.display="block";
if (checkloaded[currentF]==1){
inter=eval("setInterval('scrolldown("+currentF+")',5)");
document.getElementById("upbtn").style.display="";
if (currentF==3){
document.getElementById("downbtn").style.display="none";
}
for (i=1;i<=3;i++){
eval("document.getElementById('led"+i+"').className='num1'");
}
eval("document.getElementById('led"+currentF+"').className='num2'");
}
else{
alertloading("down");
}
}
}
function slideup(){
//slide
if (scrolling==0){
scrolling=1;
currentF--;
obj=eval("document.getElementById('f"+currentF+"')");
obj.style.display="block";
if (checkloaded[currentF]==1){
inter1=eval("setInterval('scrollup("+currentF+")',5)");
//led
document.getElementById("downbtn").style.display="";
if (currentF==1){
document.getElementById("upbtn").style.display="none";
}
for (i=1;i<=3;i++){
eval("document.getElementById('led"+i+"').className='num1'");
}
eval("document.getElementById('led"+currentF+"').className='num2'");
}
else{
alertloading("up");
}
}
}
//auto slide
var direction = "down";
var interval01;
var autotime = 8000;
function autoslide(){
if(direction == "down"){
if (currentF == 2){
direction = "up";
}
slidedown();
}
if(direction == "up"){
if (currentF == 2){
direction = "down";
}
slideup();
}
}
function iniautoslide(){
interval01 = setInterval("autoslide()",autotime);
}
//-->
</script>
</div>

复制代码

wbws · 发表于 2007 年 1 月 2 日 23:49:53

不错，就是这个
不过要改写下

lictor · 发表于 2007 年 1 月 2 日 23:51:18

楼上的FF好像不能用：（

linxicn · 发表于 2007 年 1 月 3 日 00:01:59

flash不就很简单实现了吗？
你要是不闲麻烦的话
用fireworks也可以轻松实现啊

lictor · 发表于 2007 年 1 月 3 日 19:36:07

用fireworks如何轻松实现啊

账号		自动登录	找回密码
密码			注册