table表格加滚动条

技术文章

table表格加滚动条

时间：2009-03-09 点击：2110

<HTML><HEAD><TITLE>table表格加滚动条</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE type=text/css>BODY {
FONT: 12px 细明体; CURSOR: default
}
TD {
FONT: 12px 细明体; CURSOR: default
}
.title {
BORDER-RIGHT: #555 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 4px; BACKGROUND: #ccc; PADDING-BOTTOM: 4px; OVERFLOW: hidden; BORDER-LEFT: #fff 1px solid; CURSOR: hand; PADDING-TOP: 4px; BORDER-BOTTOM: #555 1px solid; WHITE-SPACE: nowrap
}
.cdata {
BORDER-RIGHT: #ddd 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 3px; BACKGROUND: #fff; PADDING-BOTTOM: 3px; OVERFLOW: hidden; BORDER-LEFT: #fff 1px solid; PADDING-TOP: 3px; BORDER-BOTTOM: #ddd 1px solid; WHITE-SPACE: nowrap
}
</STYLE>
<SCRIPT language=JavaScript>
// 栏位标题 ( 栏位名称 # 栏位宽度 # 资料对齐 )
var DataTitles=new Array(
"歌手 / 团体#90 #left"  ,
"专辑名称   #130#left"  ,
"发行公司   #110#left"  ,
"本周排名   #58 #center",
"排名状况   #58 #center",
"上周排名   #58 #center",
"上榜周数   #58 #center",
"最高名次   #58 #center",
"销售百分比 #70 #center")
// 栏位资料 ( 二维阵列 )
var DataFields=new Array()
DataFields[0] =new Array("萧亚轩"  ,"爱的主打歌-吻"   ,"维京 Virgin"    ,"1" ,"持平"  ,"1" ,"2","1" ,"2.9 %")
DataFields[1] =new Array("张惠妹"  ,"发烧"            ,"华纳 Warner"    ,"2" ,"持平"  ,"2" ,"2","2" ,"2.1 %")
DataFields[2] =new Array("陶吉吉"  ,"黑色柳丁"        ,"全员集合 Shock" ,"3" ,"持平"  ,"3" ,"5","1" ,"1.8 %")
DataFields[3] =new Array("S.H.E"   ,"美丽新世界"      ,"华研 HIM"       ,"4" ,"持平"  ,"4" ,"6","1" ,"1.2 %")
DataFields[4] =new Array("艾薇儿"  ,"展翅高飞"        ,"博德曼 BMG"     ,"5" ,"新进榜","-" ,"1","5" ,"1.1 %")
DataFields[5] =new Array("任贤齐"  ,"一个任贤齐"      ,"滚石 Rock"      ,"6" ,"新进榜","-" ,"1","6" ,"1.0 %")
DataFields[6] =new Array("范逸臣"  ,"范逸臣第一张专辑","丰华 Forward"   ,"7" ,"持平"  ,"7" ,"2","7" ,"0.9 %")
DataFields[7] =new Array("谢霆锋"  ,"无形的他全精选"  ,"新力 Sony"      ,"8" ,"下跌"  ,"6" ,"4","4" ,"0.9 %")
DataFields[8] =new Array("周蕙"    ,"寂寞城市"        ,"福茂 Decca"     ,"9" ,"下跌"  ,"5" ,"3","5" ,"0.8 %")
DataFields[9] =new Array("周杰伦"  ,"八度空间"        ,"博德曼 BMG"     ,"10","下跌"  ,"8" ,"8","1" ,"0.8 %")
DataFields[10]=new Array("酷玩乐团","玩过头"          ,"科艺百代 EMI"   ,"11","上升"  ,"16","2","11","0.7 %")
DataFields[11]=new Array("张震岳"  ,"等我有一天"      ,"魔岩 Magicstone","12","新进榜","-" ,"1","12","0.6 %")
DataFields[12]=new Array("堂本刚"  ,"红与蓝"          ,"艾回 Avex"      ,"13","新进榜","-" ,"1","13","0.6 %")
DataFields[13]=new Array("ENERGY"  ,"COME ON"         ,"环球 Universal" ,"14","下跌"  ,"10","9","5" ,"0.6 %")
DataFields[14]=new Array("陈冠希"  ,"TRANSITION"      ,"艾回 Avex"      ,"15","下跌"  ,"9" ,"3","5" ,"0.4 %")
DataFields[15]=new Array("合辑"    ,"MTV 嘻哈大师"    ,"环球 Universal" ,"16","下跌"  ,"12","3","12","0.4 %")
</SCRIPT>
<SCRIPT language=JavaScript>
var BoxWidth = 480    // 资料表显示宽度 ( 不含卷轴 )
var ShowLine = 10    // 资料表显示列数
var RsHeight = 21    // 资料列高度
var LockCols = 1    // 要锁定的栏位数 ( 由左至右 )
function WriteTable(){    // 写入表格
var iBoxWidth=BoxWidth
var NewHTML="<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr>\
<td><div style=\"width:100%;overflow-x:scroll\">\
<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr>"
for(i=0;i<DataTitles.length;i++){
if(i<LockCols){
var cTitle=DataTitles[i].split("#")
iBoxWidth-=cTitle[1]
var DynTip=((i+1)==LockCols)?"解除锁定":"锁定此栏位"
NewHTML+="<td><div class=\"title\" style=\"width:"+cTitle[1]+"px;height:"+RsHeight+"px\" title=\""+DynTip+"\" onclick=\"ResetTable("+i+")\">"+cTitle[0]+"</div></td>"
}
}
NewHTML+="</tr>\
<tr><td colspan=\""+LockCols+"\">\
<div id=\"DataFrame1\" style=\"position:relative;width:100%;overflow:hidden\">\
<div id=\"DataGroup1\" style=\"position:relative\"></div></div>\
</td></tr></table></div></td>\
<td valign=\"top\"><div style=\"width:"+iBoxWidth+"px;overflow-x:scroll\">\
<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr>"
for(i=0;i<DataTitles.length;i++){
if(i>=LockCols){
var cTitle=DataTitles[i].split("#")
NewHTML+="<td><div class=\"title\" style=\"width:"+cTitle[1]+"px;height:"+RsHeight+"px\" title=\"锁定此栏位\" onclick=\"ResetTable("+i+")\">"+cTitle[0]+"</div></td>"
}
}
NewHTML+="</tr>\
<tr><td colspan=\""+(DataTitles.length-LockCols)+"\">\
<div id=\"DataFrame2\" style=\"position:relative;width:100%;overflow:hidden\">\
<div id=\"DataGroup2\" style=\"position:relative\"></div>\
</div></td></tr></table>\
</div></td><td valign=\"top\">\
<div id=\"DataFrame3\" style=\"position:relative;background:#000;overflow-y:scroll\" onscroll=\"SYNC_Roll()\">\
<div id=\"DataGroup3\" style=\"position:relative;width:1px;visibility:hidden\"></div>\
</div></td></tr></table>"
DataTable.innerHTML=NewHTML
ApplyData()
}
function ApplyData(){    // 写入资料
var NewHTML="<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\">"
for(i=0;i<DataFields.length;i++){
NewHTML+="<tr>"
for(j=0;j<DataTitles.length;j++){
if(j<LockCols){
var cTitle=DataTitles[j].split("#")
NewHTML+="<td><div class=\"cdata\" style=\"width:"+cTitle[1]+"px;height:"+RsHeight+"px;text-align:"+cTitle[2]+"\">"+DataFields[i][j]+"</div></td>"
}
}
NewHTML+="</tr>"
}
NewHTML+="</table>"
DataGroup1.innerHTML=NewHTML
var NewHTML="<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\">"
for(i=0;i<DataFields.length;i++){
NewHTML+="<tr>"
for(j=0;j<DataTitles.length;j++){
if(j>=LockCols){
var cTitle=DataTitles[j].split("#")
NewHTML+="<td><div class=\"cdata\" style=\"width:"+cTitle[1]+"px;height:"+RsHeight+"px;text-align:"+cTitle[2]+"\">"+DataFields[i][j]+"</div></td>"
}
}
NewHTML+="</tr>"
}
NewHTML+="</table>"
DataGroup2.innerHTML=NewHTML
DataFrame1.style.pixelHeight=RsHeight*ShowLine
DataFrame2.style.pixelHeight=RsHeight*ShowLine
DataFrame3.style.pixelHeight=RsHeight*ShowLine+RsHeight
DataGroup3.style.pixelHeight=RsHeight*(DataFields.length+1)
}
function ResetTable(n){
var iBoxWidth=0
for(i=0;i<DataTitles.length;i++){
if(i<(n+1)){
var cTitle=DataTitles[i].split("#")
iBoxWidth+=parseInt(cTitle[1])
}
}
if(iBoxWidth>BoxWidth){
var Sure=confirm("\n锁定栏位的宽度大於资料表显示的宽　　\n\n度，这可能会造成版面显示不正常。\n\n\n您确定要继续吗？")
}else{
Sure=true
}
if(Sure){
LockCols=(LockCols==n+1)?0:n+1
WriteTable()
}
}
function SYNC_Roll(){
DataGroup1.style.posTop=-DataFrame3.scrollTop
DataGroup2.style.posTop=-DataFrame3.scrollTop
}
window.onload=WriteTable
</SCRIPT>
<META content="MSHTML 6.00.3790.2666" name=GENERATOR></HEAD>
<BODY>
<CENTER>
<H4>锁定表格栏位范例网页</H4>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD style="BORDER-RIGHT: white 2px inset; BORDER-TOP: white 2px inset; BORDER-LEFT: white 2px inset; BORDER-BOTTOM: white 2px inset; BACKGROUND-COLOR: scrollbar">
<DIV id=DataTable>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD>
<DIV style="OVERFLOW-X: scroll; WIDTH: 100%">
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD>
<DIV class=title title=解除锁定 style="WIDTH: 90px; HEIGHT: 21px" onclick=ResetTable(0)>歌手 / 团体</DIV></TD></TR>
<TR>
<TD>
<DIV id=DataFrame1 style="OVERFLOW: hidden; WIDTH: 100%; POSITION: relative; HEIGHT: 210px">
<DIV id=DataGroup1 style="POSITION: relative">
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">萧亚轩</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">张惠妹</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">陶吉吉</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">S.H.E</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">艾薇儿</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">任贤齐</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">范逸臣</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">谢霆锋</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">周蕙</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">周杰伦</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">酷玩乐团</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">张震岳</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">堂本刚</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">ENERGY</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">陈冠希</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 90px; HEIGHT: 21px; TEXT-ALIGN: left">合辑</DIV></TD></TR></TBODY></TABLE></DIV></DIV></TD></TR></TBODY></TABLE></DIV></TD>
<TD vAlign=top>
<DIV style="OVERFLOW-X: scroll; WIDTH: 390px">
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 130px; HEIGHT: 21px" onclick=ResetTable(1)>专辑名称 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 110px; HEIGHT: 21px" onclick=ResetTable(2)>发行公司 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 58px; HEIGHT: 21px" onclick=ResetTable(3)>本周排名 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 58px; HEIGHT: 21px" onclick=ResetTable(4)>排名状况 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 58px; HEIGHT: 21px" onclick=ResetTable(5)>上周排名 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 58px; HEIGHT: 21px" onclick=ResetTable(6)>上榜周数 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 58px; HEIGHT: 21px" onclick=ResetTable(7)>最高名次 </DIV></TD>
<TD>
<DIV class=title title=锁定此栏位 style="WIDTH: 70px; HEIGHT: 21px" onclick=ResetTable(8)>销售百分比 </DIV></TD></TR>
<TR>
<TD colSpan=8>
<DIV id=DataFrame2 style="OVERFLOW: hidden; WIDTH: 100%; POSITION: relative; HEIGHT: 210px">
<DIV id=DataGroup2 style="POSITION: relative">
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">爱的主打歌-吻</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">维京 Virgin</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">持平</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">2.9 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">发烧</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">华纳 Warner</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">持平</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">2.1 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">黑色柳丁</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">全员集合 Shock</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">3</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">持平</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">3</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">1.8 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">美丽新世界</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">华研 HIM</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">4</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">持平</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">4</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">6</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">1.2 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">展翅高飞</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">博德曼 BMG</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">新进榜</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">-</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">1.1 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">一个任贤齐</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">滚石 Rock</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">6</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">新进榜</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">-</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">6</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">1.0 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">范逸臣第一张专辑</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">丰华 Forward</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">7</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">持平</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">7</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">7</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.9 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">无形的他全精选</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">新力 Sony</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">8</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">下跌</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">6</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">4</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">4</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.9 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">寂寞城市</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">福茂 Decca</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">9</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">下跌</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">3</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.8 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">八度空间</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">博德曼 BMG</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">10</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">下跌</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">8</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">8</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.8 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">玩过头</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">科艺百代 EMI</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">11</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">上升</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">16</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">2</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">11</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.7 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">等我有一天</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">魔岩 Magicstone</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">12</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">新进榜</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">-</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">12</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.6 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">红与蓝</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">艾回 Avex</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">13</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">新进榜</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">-</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">1</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">13</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.6 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">COME ON</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">环球 Universal</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">14</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">下跌</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">10</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">9</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.6 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">TRANSITION</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">艾回 Avex</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">15</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">下跌</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">9</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">3</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">5</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.4 %</DIV></TD></TR>
<TR>
<TD>
<DIV class=cdata style="WIDTH: 130px; HEIGHT: 21px; TEXT-ALIGN: left">MTV 嘻哈大师</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 110px; HEIGHT: 21px; TEXT-ALIGN: left">环球 Universal</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">16</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">下跌</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">12</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">3</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 58px; HEIGHT: 21px; TEXT-ALIGN: center">12</DIV></TD>
<TD>
<DIV class=cdata style="WIDTH: 70px; HEIGHT: 21px; TEXT-ALIGN: center">0.4 %</DIV></TD></TR></TBODY></TABLE></DIV></DIV></TD></TR></TBODY></TABLE></DIV></TD>
<TD vAlign=top>
<DIV id=DataFrame3 style="OVERFLOW-Y: scroll; BACKGROUND: #000; POSITION: relative; HEIGHT: 231px" onscroll=SYNC_Roll()>
<DIV id=DataGroup3 style="VISIBILITY: hidden; WIDTH: 1px; POSITION: relative; HEIGHT: 357px"></DIV></DIV></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE>
<P>点取栏位标题可重新设定或解除目前的锁定状态</P></CENTER></BODY></HTML>

滑动菜单

flash图片左右左右滑动的幻灯效果

双向缓冲滑动图片自动播放

多功能弹出div窗口组件

title及alt提示特效

> 返回

地址：上海市普陀区胶州路941号长久商务中心电话： QQ：