迅雷动漫幻灯代码(非FLASH)-伟大的郭大侠的博客

迅雷动漫幻灯代码(非FLASH)

2009-12-14 10:50:16

前几天看到迅雷动漫主页上的幻灯片很有趣，抓下来研究一下。
全部代码下载
如有不妥请告知。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>动漫频道 - 迅雷看看</TITLE>
<META content="text/html; charset=utf-8" http-equiv=Content-Type>
<style>
* {
PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px
}
HTML {
BACKGROUND: #ffffff
}
BODY {
FONT: 12px/20px Arial, Verdana, Lucida, Helvetica, simsun, sans-serif; COLOR: #313131
}
A {
COLOR: #016a9f; TEXT-DECORATION: none
}
A:hover {
TEXT-DECORATION: underline
}
img {border:0px;}
.kk-catalog .rbgx .content {
HEIGHT: 363px
}
.kk-catalog .kanguo .content {
HEIGHT: 363px
}
.kk-catalog .qqdy .content {
HEIGHT: 310px
}
.kk-catalog .rank .content {
HEIGHT: 310px
}
.kk-index .flash-box {
PADDING-BOTTOM: 5px; PADDING-LEFT: 9px; WIDTH: 450px; PADDING-RIGHT: 9px; MARGIN-BOTTOM: 8px; BACKGROUND: url(../img/flashBg.png) no-repeat 0px 0px; HEIGHT: 251px; OVERFLOW: hidden; PADDING-TOP: 5px
}
.kk-index .flash-box H2 {
LINE-HEIGHT: 20px; WIDTH: 448px; MARGIN-BOTTOM: 1px; HEIGHT: 20px; COLOR: #193b5f; FONT-SIZE: 13px
}
.kk-index .flash-box .big-pic {
WIDTH: 366px; FLOAT: left; HEIGHT: 188px; OVERFLOW: hidden; MARGIN-RIGHT: 2px
}
.kk-index .flash-box .big-pic IMG {
BORDER-BOTTOM: #fff 1px solid; BORDER-LEFT: #fff 1px solid; WIDTH: 364px; DISPLAY: block; HEIGHT: 186px; BORDER-TOP: #fff 1px solid; BORDER-RIGHT: #fff 1px solid
}
.kk-index .flash-box .pic-list {
POSITION: relative; WIDTH: 81px; FLOAT: left; HEIGHT: 188px
}
.kk-index .flash-box .pic-list .pre {
POSITION: absolute; WIDTH: 81px; BACKGROUND: url(http://misc.web.xunlei.com/www_5_1/img/sprite.png) no-repeat; HEIGHT: 11px; TOP: 0px; LEFT: 0px
}
.kk-index .flash-box .pic-list .next {
POSITION: absolute; WIDTH: 81px; BACKGROUND: url(http://misc.web.xunlei.com/www_5_1/img/sprite.png) no-repeat; HEIGHT: 11px; TOP: 0px; LEFT: 0px
}
.kk-index .flash-box .pic-list .no-pre {
POSITION: absolute; WIDTH: 81px; BACKGROUND: url(http://misc.web.xunlei.com/www_5_1/img/sprite.png) no-repeat; HEIGHT: 11px; TOP: 0px; LEFT: 0px
}
.kk-index .flash-box .pic-list .no-next {
POSITION: absolute; WIDTH: 81px; BACKGROUND: url(http://misc.web.xunlei.com/www_5_1/img/sprite.png) no-repeat; HEIGHT: 11px; TOP: 0px; LEFT: 0px
}
.kk-index .flash-box .pic-list .pre {
BACKGROUND-POSITION: -804px -108px
}
.kk-index .flash-box .pic-list .no-pre {
BACKGROUND-POSITION: -852px -108px
}
.kk-index .flash-box .pic-list .next {
BACKGROUND-POSITION: -804px -125px; TOP: 177px
}
.kk-index .flash-box .pic-list .no-next {
BACKGROUND-POSITION: -852px -125px; TOP: 177px
}
.kk-index .flash-box .pic-list UL {
POSITION: absolute; TOP: 0px; LEFT: 5px
}
.kk-index .flash-box .pic-list LI {
WIDTH: 71px; MARGIN-BOTTOM: 2px; FLOAT: left; HEIGHT: 40px; OVERFLOW: hidden
}
.kk-index .flash-box .pic-list LI A {
WIDTH: 71px; DISPLAY: block; HEIGHT: 40px; OVERFLOW: hidden
}
.kk-index .flash-box .pic-list LI A IMG {
PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; WIDTH: 71px; PADDING-RIGHT: 1px; DISPLAY: block; HEIGHT: 40px; PADDING-TOP: 1px
}
.kk-index .flash-box .pic-list LI A:hover {
BORDER-BOTTOM: #56aad8 2px solid; BORDER-LEFT: #56aad8 2px solid; WIDTH: 67px; HEIGHT: 36px; BORDER-TOP: #56aad8 2px solid; BORDER-RIGHT: #56aad8 2px solid
}
.kk-index .flash-box .pic-list LI A.currA {
BORDER-BOTTOM: #56aad8 2px solid; BORDER-LEFT: #56aad8 2px solid; WIDTH: 67px; HEIGHT: 36px; BORDER-TOP: #56aad8 2px solid; BORDER-RIGHT: #56aad8 2px solid
}
.kk-index .flash-box .pic-list LI A:hover IMG {
MARGIN: -2px
}
.kk-index .flash-box .pic-list LI A.currA IMG {
MARGIN: -2px
}
.kk-index .flash-box .flash-txt {
LINE-HEIGHT: 19px; HEIGHT: 38px; CLEAR: both; PADDING-TOP: 3px
}
.kk-index .flash-box .flash-txt H3 {
HEIGHT: 19px; FONT-SIZE: 12px; OVERFLOW: hidden
}
.kk-index .flash-box .flash-txt EM {
FONT: bold 14px Arial, Helvetica, sans-serif; COLOR: #ff5b01; MARGIN-LEFT: 8px
}
.kk-index .flash-box .flash-txt P {
HEIGHT: 19px; COLOR: #939393; FONT-SIZE: 12px; OVERFLOW: hidden
}
.kk-catalog .flash-box {
BORDER-BOTTOM: #ccdff2 1px solid; BORDER-LEFT: #ccdff2 1px solid; PADDING-BOTTOM: 10px; PADDING-LEFT: 10px; WIDTH: 704px; PADDING-RIGHT: 10px; MARGIN-BOTTOM: 8px; HEIGHT: 227px; OVERFLOW: hidden; BORDER-TOP: #ccdff2 1px solid; BORDER-RIGHT: #ccdff2 1px solid; PADDING-TOP: 10px
}
.kk-catalog .flash-box .big-pic {
WIDTH: 379px; FLOAT: left; HEIGHT: 227px; OVERFLOW: hidden; MARGIN-RIGHT: 6px
}
.kk-catalog .flash-box .big-pic IMG {
WIDTH: 379px; DISPLAY: block; HEIGHT: 227px
}
.kk-catalog .flash-box .pic-list {
WIDTH: 319px; FLOAT: left; HEIGHT: 227px; OVERFLOW: hidden
}
.kk-catalog .flash-box .pic-list LI {
BORDER-BOTTOM: #ededed 1px solid; BORDER-LEFT: #ededed 1px; LINE-HEIGHT: 18px; WIDTH: 319px; WHITE-SPACE: nowrap; MARGIN-BOTTOM: -1px; FLOAT: left; HEIGHT: 44px; OVERFLOW: hidden; BORDER-TOP: #ededed 1px solid; BORDER-RIGHT: #ededed 1px
}
.kk-catalog .flash-box .pic-list LI A {
POSITION: relative; PADDING-BOTTOM: 4px; PADDING-LEFT: 64px; PADDING-RIGHT: 10px; DISPLAY: block; HEIGHT: 36px; COLOR: #7c7b7b; OVERFLOW: hidden; PADDING-TOP: 4px
}
.kk-catalog .flash-box .pic-list LI A:hover {
BACKGROUND: #f5f3f3; TEXT-DECORATION: none
}
.kk-catalog .flash-box .pic-list LI.currA A {
BACKGROUND: #f5f3f3; TEXT-DECORATION: none
}
.kk-catalog .flash-box .pic-list LI STRONG {
DISPLAY: block; COLOR: #4a4a4a
}
.kk-catalog .flash-box .pic-list IMG {
BORDER-BOTTOM: #9f9f9f 1px solid; POSITION: absolute; BORDER-LEFT: #9f9f9f 1px solid; WIDTH: 50px; HEIGHT: 29px; BORDER-TOP: #9f9f9f 1px solid; TOP: 6px; BORDER-RIGHT: #9f9f9f 1px solid; LEFT: 4px
}

</style>
<SCRIPT type=text/javascript data-original="js/js4round.js"></SCRIPT>
<SCRIPT type=text/javascript data-original="js/glogin_frm_cover.js"></SCRIPT>
</HEAD>
<BODY class=kk-catalog>
<DIV class=flash-box>
<DIV id=SwitchBigPic class=big-pic>
<DIV class=big-pic><A href="#"
blockid="2232"><IMG alt="空之境界剧场版第七章杀人考察（后）"
data-original="images/test/bd1d107cbdae16eb02bd54c19ba9bbe3.jpg"></A></DIV>
<DIV class=big-pic><A href="#"
blockid="2232"><IMG alt=纯爱新剧《好想告诉你》更新至第10集
data-original="images/test/e49e487fd92213610c13f0ad009e8b7f.jpg"></A></DIV>
<DIV class=big-pic><A href="#"
blockid="2232"><IMG alt="热血少年动画《死神》更新至第249集"
data-original="images/test/047715016e0e1a094d2228c551138ad6.jpg"></A></DIV>
<DIV class=big-pic><A href="#"
blockid="2232"><IMG alt=十月强番《妖精的尾巴》更新至第9集
data-original="images/test/eaa8029991e156b162b1d605564845be.jpg"></A></DIV>
</DIV>
<DIV class=pic-list>
<UL>
<LI id=SwitchLi_0><A id=SwitchSmaPic_0 class=currA
href="#" blockid="2232"><IMG
alt=""
data-original="images/test/3cd5d53ad462e628df5502618f72d1b0.gif"><STRONG>空之境界剧场版第七章
杀人考察（后）</STRONG>空之境界剧场版最终章震撼登陆精彩呈献</A> </LI>
<LI id=SwitchLi_1><A id=SwitchSmaPic_1
href="#" blockid="2232"><IMG
alt=""
data-original="images/test/5439b7ab98706d38e8936a0509a36d1d.gif"><STRONG>纯爱新剧《好想告诉你》更新至第10集</STRONG>椎名轻穗大人气恋爱漫画改编
强势恋爱新剧</A> </LI>
<LI id=SwitchLi_2><A id=SwitchSmaPic_2
href="#" blockid="2232"><IMG
alt=""
data-original="images/test/cd54d0db9674df8b0938f6531cce2e39.gif"><STRONG>热血少年动画《死
神》更新至第249集</STRONG>狂热大战持续飙升强强对决精彩不容错过</A> </LI>
<LI id=SwitchLi_3><A id=SwitchSmaPic_3
href="#" blockid="2232"><IMG
alt=""
data-original="images/test/a16300ea6a1d3e0e8ff6906bdd26040f.gif"><STRONG>十月强番《妖精的尾巴》更新至第9集</STRONG>真岛hiro少年热血强番登场
叫板海贼王 </A></LI>

</UL>
</DIV>
</DIV>
<SCRIPT>
var MovieRecom={
bigpic:"SwitchBigPic", //大图DIV之ID通用部分
step:227,
smallpic:"SwitchLi",//小图之ID通用部分
selectstyle:"currA", //小图被选中之后的CSS
pictxt:"", //配套图片文字
totalcount:4, //图片数量
autotimeintval:5000,
objname:"MovieRecom" //对象名称
};
BigNews.init(MovieRecom);
</SCRIPT>
</BODY></HTML>