|
主题: 滚动效果如何做出来
|
 嘻哈标明
职务:普通成员
等级:1
金币:1.0
发贴:173
|
#12005/10/26 22:04:23
图片如下:  像这样的滚动效果如何做出来呢,要求ie和firefox都能正常运行
|
 whirlwind
职务:普通成员
等级:1
金币:0.0
发贴:94
|
|
 嘻哈标明
职务:普通成员
等级:1
金币:1.0
发贴:173
|
#32005/10/27 23:21:03
如果动态生成呢?两级就够了
|
 苦寒竹
职务:普通成员
等级:1
金币:0.0
发贴:10
|
#42005/10/29 8:29:09
以前做过,div就是
|
 苦寒竹
职务:普通成员
等级:1
金币:0.0
发贴:10
|
#52005/10/29 8:30:08
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Netstart v1.0</title> <STYLE type=text/css> a { font-size: 10pt; color: #000000;behavior:url('kuhanzhu.htc');text-decoration: none} a:hover { font-size: 10pt; color: #FF0000; text-decoration: none} a:hover { font-size: 10pt; color: #FF0000; text-decoration: none} a:visited { font-size: 10pt; text-decoration: none} .titleStyle { BORDER-TOP: #ffffff 1px solid; FONT-SIZE: 9pt; CURSOR: hand; COLOR: #ffffff; BACKGROUND-COLOR: #90C040 } .contentStyle { FONT-SIZE: 9pt; COLOR:blue; BACKGROUND-COLOR: #eeffee } BODY { FONT-SIZE: 9pt } </STYLE> <base target=_blank> </head>
<BODY scroll=no topmargin="0" leftmargin="0"oncontextmenu="return false" ><table><tr><td> <SCRIPT language=javascript> <!-- var layerTop=0; //菜单顶边距 var layerLeft=0; //菜单左边距 var layerWidth=140; //菜单总宽 var titleHeight=20; //标题栏高度 var contentHeight=200; //内容区高度 var stepNo=10; //移动步数,数值越大移动越慢
var itemNo=0;runtimes=0; document.write('<span id=itemsLayer style="position:absolute;overflow:hidden;border:1px solid #856BF2;left:'+layerLeft+';top:'+layerTop+';width:'+layerWidth+';">');
function addItem(itemTitle,itemContent){ itemHTML='<div id=item'+itemNo+' itemIndex='+itemNo+' style="position:relative;left:0;top:'+(-contentHeight*itemNo)+';width:'+layerWidth+';"><table width=100% cellspacing="0" cellpadding="0">'+ '<tr><td height='+titleHeight+' onclick=changeItem('+itemNo+') class="titleStyle" align=center>'+itemTitle+'</td></tr>'+ '<tr><td height='+contentHeight+' class="contentStyle">'+itemContent+'</td></tr></table></div>'; document.write(itemHTML); itemNo++; } //添加菜单标题和内容,可任意多项,注意格式: addItem('置顶','<center><a href="../main/Soft/goldtool.rar">金牌电脑工具箱</a><BR><BR><a href="http://www.eniacjia.com/download/DietMP3.zip">MP3压缩器</a><BR><a href="http://www.feilang.net/bbs/"></a> <BR><a href="http://www.odbopp.com/"></a><BR><a href="http://www.onlyradio.org/"></a><BR><a href="#"></a><BR><a href="#"></a><BR><a href="#"></a></center>'); addItem('我的网址','<center><a href="http://www.kanunu.net">卡努努</a><BR><BR><a href="http://www.voc107.com">城市之声</a><BR><a href="http://www.feilang.net/bbs/">飞浪考网论坛</a> <BR><a href="http://www.odbopp.com/">绿芒果设计</a><BR><a href="http://www.onlyradio.org/">唯音网络电台</a><BR><a href="#"></a><BR><a href="#"></a><BR><a href="#"></a></center>'); addItem('技术论坛','<center><a href="#">正在建设中</a><BR><BR><a href="#"></a><BR><BR><a href="#"></a> <BR><BR><a href="#"></a></center>'); addItem('流行音乐','<center><a href="hudie.html">梁祝——《蝴蝶》</a> <BR><BR><a href="xiangqishui.html">当你孤单你会想起谁</a><BR><BR><a href="#"></a> <BR><BR><a href="#"></a></center>'); addItem('每月推荐','<center><a href="http://freehost11.websamba.com/kuhanzhu/rainforestfull.rar">热带雨林屏保</a><BR><BR><a href="http://freehost09.websamba.com/ittools/pingbao/fish.rar">热带鱼屏保</a> <BR><BR><a href="http://freehost09.websamba.com/ittools/pingbao/ButterflyGarden.rar">蝴蝶花园屏保</a> <BR><BR><a href="http://freehost09.websamba.com/ittools/pingbao/Waterworld.rar">深海水世界屏保</a><BR><BR><a href="http://freehost09.websamba.com/ittools/pingbao/konglong.rar">恐龙屏保</a><BR><BR><a href="http://freehost09.websamba.com/ittools/pingbao/autumnleaves.rar">秋天的落叶</a></center>'); addItem('在线广播','<center><a href="http://www.bmr.com.cn/script/live.ram">北京音乐台</a><br><a href="mms://video.zjonline.com.cn/voc107/voc107.asx">城市之声</a><br><a href="mms://vstream.sina.com.cn/900">音乐之声</a></center>');
document.write('</span>') document.all.itemsLayer.style.height=itemNo*titleHeight+contentHeight;
toItemIndex=itemNo-1;onItemIndex=itemNo-1;
function changeItem(clickItemIndex){ toItemIndex=clickItemIndex; if(toItemIndex-onItemIndex>0) moveUp(); else moveDown(); runtimes++; if(runtimes>=stepNo){ onItemIndex=toItemIndex; runtimes=0;} else setTimeout("changeItem(toItemIndex)",10); }
function moveUp(){ for(i=onItemIndex+1;i<=toItemIndex;i++) eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)-contentHeight/stepNo;'); }
function moveDown(){ for(i=onItemIndex;i>toItemIndex;i--) eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)+contentHeight/stepNo;'); } changeItem(0); //--> </SCRIPT><br><br><br><br><br><br><br><br><br><br><br><br><br><br>rf<br><br><br><br></td></tr><tr><td><table border="1" cellpadding="0" cellspacing="0" width="100%" bordercolorlight="#000000" bordercolordark="#ffffff" bgcolor="#e7e7e7"><tr><td><a href=http://www.hosen.zj.com>首页</a></td><td><a href="http://freehost11.websamba.com/kuhanzhu/liuyanben/index.asp?user=kuhanzhu">留言</a></td><td><a href=reg.asp>申请</a></td><td><a href=about.html>关于</a></td></tr></table></td></tr></table> </body> </html>
这是我以前弄的,自己研究下吧
|
 嘻哈标明
职务:普通成员
等级:1
金币:1.0
发贴:173
|
#62005/10/29 22:16:36
太好了,在firefox也能通过. 现在要告诉的是怎么动态实现,就是从数据库里得到数据。
|
 gina211
职务:普通成员
等级:1
金币:0.0
发贴:1
|
#72005/11/5 3:25:34
 xiexie
|
 嘻哈标明
职务:普通成员
等级:1
金币:1.0
发贴:173
|
#82005/11/13 14:01:42
kuhanzhu的代码我试过了,但是有个问题....比如像我发的图..如果"基本信息"有几条连接(就是按钮吧)..他不会自动生成滚动条..有办法能实现吗?
|