檔案
style_index.css 規範版型的css
swish2.asp 用以呼叫執行asp的頁面
todaynews.asp 真正執行切換圖片的頁面 (改圖請改這頁即可)
focus_index.js 切換廣告的JAVA
備註:檔名需改為asp 並且上傳至網站才能被執行
style_index.css內容
|
body {
background-image: url(http://223.27.37.70/image/index/bk.gif);
margin: 0px;
}
a:link {
font-size: 13px;
color: #033CA5;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a.a1, a.memberlink,a.news {
font-size: 13px;
color: #383838;
text-decoration: none;
}
a.a1:hover, a.memberlink:hover,a.news:hover {
font-size: 13px;
color: #003DA0;
text-decoration: none;
}
a.a2 {
font-size: 13px;
color: #CE1616;
text-decoration: none;
}
a.a2:hover {
font-size: 13px;
color: #000000;
text-decoration: none;
}
.a3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #78B51A;
}
a.dtill:link {
font-size: 16px;
color: #000000;
text-decoration: none;
}
a.dtill:hover {
font-size: 16px;
color: #033CA5;
text-decoration: none;
}
a.dtill:visited {
font-size: 16px;
color: #666666;
text-decoration: none;
}
.hidden {
display: none;
}
/*廣告切換 start*/
#todaynews {
float: left;
verflow: hidden;
margin-right: 8px;
width: 642px;
height: 233px;
}
#todaynews #todcall {
height: 20px;
position: absolute;
float: right;
z-index: 0;
padding-top: 0px;
padding-right: 15px;
padding-bottom: 5px;
padding-left: 0px;
margin: 0px;
width: 627px;
}
#todaynews #todtop {
width: 627px;
margin: 0px;
height: 17px;
overflow: hidden;
padding-top: 4px;
padding-right: 0px;
padding-bottom: 4px;
padding-left: 15px;
}
#todaynews #toddown {
float: left;
overflow: hidden;
text-align: left;
width: 642px;
background-image: url(http://223.27.37.70/image/index/loadingnews.gif);
height: 210px;
background-repeat: no-repeat;
background-position: center center;
display: block;
position: relative;
margin: 0px;
padding: 0px;
z-index: 0;
}
#todaynews #toddown img {
height: 210px;
/*width: 642px;*/
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#todaynews dl {
margin: 0px;
width: 642px;
padding: 0px;
}
#todaynews dt {
font-size: 15px;
color: #666666;
float: left;
margin-top: 0px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 0px;
background-image: url(http://223.27.37.70/image/index/as5.gif);
background-repeat: no-repeat;
background-position: left center;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 10px;
}
#todaynews dd {
float: left;
margin: 0px;
padding: 0px;
}
#todaynews .more {
background-image: url(http://223.27.37.70/image/index/as4.gif);
background-repeat: no-repeat;
background-position: left center;
_background-position: left top;/*ie6*/
_margin-top: 2px;/*ie6*/
height: 16px;
width: 20px;
}
#todaynews .banner_on {
background-image: url(http://223.27.37.70/image/index/todaynews_a1.gif);
background-position: right center;
cursor: pointer;
background-repeat: no-repeat;
height: 20px;
width: 15px;
float: right;
margin-right: 3px;
margin-left: 3px;
}
#todaynews .banner_off {
background-image: url(http://223.27.37.70/image/index/todaynews_a1.gif);
background-position: left center;
cursor: pointer;
background-repeat: no-repeat;
height: 20px;
width: 15px;
float: right;
margin-right: 3px;
margin-left: 3px;
}
#todaynews .news_on {
width: 642px;
float: left;
height: 20px;
padding: 0px;
margin: 0px;
}
#todaynews .news_off {
DISPLAY: none
}
/*廣告切換 end*/
|
swish2.asp 內容
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5" />
<title>banner</title>
<script src="focus_index.js" type="text/javascript"></script>
<link href="style_index.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="todaynews"><% server.execute "todaynews.asp" %></div>
</body>
</html>
|
todaynews.asp 內容
|
<div id="todcall">
<div id="dcall5" class="banner_off" onmouseover="javascript:setDbox(5);"></div>
<div id="dcall4" class="banner_off" onmouseover="javascript:setDbox(4);"></div>
<div id="dcall3" class="banner_off" onmouseover="javascript:setDbox(3);"></div>
<div id="dcall2" class="banner_off" onmouseover="javascript:setDbox(2);"></div>
<div id="dcall1" class="banner_on" onmouseover="javascript:setDbox(1);"></div>
</div>
<div id="todtop">
<dl id="dtab1" class="news_on" onmouseover="javascript:setDbox(1);"><dt>圖片1</dt>
<dd class="more"></dd></dl>
<dl id="dtab2" class="news_off" onmouseover="javascript:setDbox(2);"><dt>圖片2</dt>
<dd class="more"></dd></dl>
<dl id="dtab3" class="news_off" onmouseover="javascript:setDbox(3);"><dt>圖片3</dt>
<dd class="more"></dd></dl>
<dl id="dtab4" class="news_off" onmouseover="javascript:setDbox(4);"><dt>圖片4</dt>
<dd class="more"></dd></dl>
<dl id="dtab5" class="news_off" onmouseover="javascript:setDbox(5);"><dt>圖片5</dt>
<dd class="more"></dd></dl>
</div>
<div id="toddown">
<div id="dbox1" class="dboxcss" onmouseover="javascript:setDbox(1)"><a href="/BIG5/literature/plugin/indextext.asp?
free=100255243" target="_blank"><img src="http://www.myfreshnet.com/BIG5/testbanner/p1.jpg"></a></div>
<div id="dbox2" class="dboxcss" onmouseover="javascript:setDbox(2)"><a href="/BIG5/literature/plugin/indextext.asp?
free=100255243" target="_blank"><img src="http://www.myfreshnet.com/BIG5/testbanner/p2.jpg"></a></div>
<div id="dbox3" class="dboxcss" onmouseover="javascript:setDbox(3)"><a
href="http://223.27.37.81/BIG5/literature/li_chat/chat_index.asp?themeid=50&assortid=0"_blank"><img
src="http://www.myfreshnet.com/BIG5/testbanner/p3.jpg"></a></div>
<div id="dbox4" class="dboxcss" onmouseover="javascript:setDbox(4)"><a href="#"><img
src="http://www.myfreshnet.com/BIG5/testbanner/p4.jpg"></a></div>
<div id="dbox5" class="dboxcss" onmouseover="javascript:setDbox(5)"><a href="#"><img
src="http://www.myfreshnet.com/BIG5/testbanner/p5.jpg"></a></div>
</div>
<!--rollCount = 5，數字為banner數量-->
<SCRIPT type=text/javascript>var rollPeriod = 8000;var rollCount = 6;setDbox(1);</SCRIPT>
|
focus_index.js內容
//廣告切換
var rollCoun;
var rollPeriod = 2000;
var isStart = true;
var nn = 1;
var tt = false;
function dtab_img() {
if (isStart) {
if (nn > rollCount) {
nn = 1;
}
setDbox(nn);
}else{
tt = setTimeout('dtab_img()', 1000);
}
}
function setDbox(i){
if (tt) {
clearTimeout(tt);
}
selectLayer1(i);
nn=parseInt(i)+1;
tt=setTimeout('dtab_img()', rollPeriod);
}
function selectLayer1(i){
for (var j = 1; j <= rollCount; j++) {
if (j == i) {
document.getElementById("dcall" + j).className = "banner_on";
document.getElementById("dbox" + j).className = "dboxcss";
document.getElementById("dtab" + j).className="news_on";
} else {
document.getElementById("dcall" + j).className = "banner_off";
document.getElementById("dbox" + j).className = "dboxcss hidden";
document.getElementById("dtab" + j).className="news_off";
}
}
} |
展示畫面
留言列表
工作紀事 (1)
