<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body >
<table >
<tr>
<!--更换的大图-->
<td width="85%"><img src="image/Graphic Design_900X600/12.jpg" style=" margin:10px 20px 32px 5px;" alt=""荔枝湾旅游地图(第一版)"设计" width="502" height="394" border="0" id="main_img" rel="images/03.jpg" link="http://焦点" /></td>
<!-- 滚动内容 -->
<td width="15%">
<div id=demo style="overflow:hidden; height:350px;">
<div id="demo1"> <img src="image/Graphic Design_200X150/12.jpg" alt=""设计" border="0" class="thumb_img" rel="image/Graphic Design_900X600/12.jpg" link="http://焦点" οnclick="javascript:window.open('Graphic_Design12.html') "/> <img src="image/Graphic Design_200X150/08.jpg" alt="中央" border="0" class="thumb_img" rel="image/Graphic Design_900X600/08.jpg" link="http://焦点" οnclick="javascript:window.open('Graphic_Design08.html')" /> <img src="image/Graphic Design_200X150/09.jpg" alt="签名" border="0" class="thumb_img" rel="image/Graphic Design_900X600/09.jpg" link="http://焦点" οnclick="javascript:window.open('Graphic_Design09.html')" /> <img src="image/Graphic Design_200X150/10.jpg" alt="信片" border="0" class="thumb_img" rel="image/Graphic Design_900X600/10.jpg" link="http://焦点" οnclick="javascript:window.open('Graphic_Design10.html')" /> </div>
<div id=demo2></div>
</div>
<script language="javascript">
var speed=30;
demo2.innerHTML=demo1.innerHTML;
demo.scrollTop=demo.scrollTop;
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight;
else{
demo.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed)
demo.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</script></td>
</tr>
</table>
<!--<script type="text/javascript">
swfobject.registerObject("FlashID");
swfobject.registerObject("FlashID");-->
</script>
</body>
</html>
<!--更换图片-->
<script language="javascript" type="text/javascript">
function $(e) {
return document.getElementById(e);
}
document.getElementsByClassName = function(cl) {
var retnode = [];
var myclass = new RegExp('\\b'+cl+'\\b');
var elem = this.getElementsByTagName('*');
for (var i = 0; i < elem.length; i++) {
var classes = elem[i].className;
if (myclass.test(classes)) retnode.push(elem[i]);
}
return retnode;
}
var MyMar;
var speed = 30; //速度,越大越慢
var spec = 30; //每次滚动的间距, 越大滚动越快
var ipath = 'image/'; //图片路径
var thumbs = document.getElementsByClassName('thumb_img');
for (var i=0; i<thumbs.length; i++) {
thumbs[i].onmouseover = function () {$('main_img').src=this.rel; $('main_img').link=this.link;};
//thumbs[i].onclick = function () {location = this.link}
}
//$('main_img').onclick = function () {location = this.link;}
$('gotop').onmouseover = function() {this.src = ipath + 'gotop2.gif'; MyMar=setInterval(gotop,speed);}
$('gotop').onmouseout = function() {this.src = ipath + 'gotop.gif'; clearInterval(MyMar);}
$('gobottom').onmouseover = function() {this.src = ipath + 'gobottom2.gif'; MyMar=setInterval(gobottom,speed);}
$('gobottom').onmouseout = function() {this.src = ipath + 'gobottom.gif'; clearInterval(MyMar);}
function gotop() {$('showArea').scrollTop-=spec;}
function gobottom() {$('showArea').scrollTop+=spec;}
</script>