<!--[if IE]>
<IE:Download ID="marqueedata" STYLE="behavior:url(#default#download)" />
<marquee id="externalmarquee" direction=up scrollAmount=4 style="width:200px;height:150px;border:1px solid black;padding:3px" onMouseover="this.scrollAmount=2" onMouseout="this.scrollAmount=4" src="update.htm">
</marquee>
<script language="JavaScript1.2">
function downloaddata(){
marqueedata.startDownload(externalmarquee.src,displaydata)
}
function displaydata(data){
externalmarquee.innerHTML=data
}
if (document.all)
window.onload=downloaddata
</script>
<![endif]-->
今天找到的一个不错的样式,个人感觉很好,可以在页面中大量使用。
-------------------------------------------------------------
<script language="JavaScript1.3" type="text/javascript">
function scbg(objRef, state) {
objRef.style.backgroundColor = (1 == state) ? '#EEEEEE' : '#FFFFFF';
return;
}
</script>
<a onmouseout="scbg(this, 0);" onmouseover="scbg(this, 1);">注意看背景</a>
今天在网上找的代码,整理了一下:
-----------------------上下滚动主要部分-------------------------
<!-- 图片宽度width:90 图片高度height:150 背景颜色background:#214984 这些根据你实际的需要修改-->
<div id=demo style=overflow:hidden;height:150;width:90;background:#214984;color:#ffffff>
<div id=demo1>
<!-- 加入要滚动的内容 -->
<!--#include file="GX/PHOTOIMG.htm"--></div>
<div id=demo2></div>
</div>
-----------------------向上滚动-------------------------------
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
-----------------------向下滚动-------------------------------
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollTop=demo.scrollHeight
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
-----------------------左右滚动主要部分--------------------------
<!-- 图片宽度width:90 图片高度height:150 背景颜色background:#214984 这些根据你实际的需要修改-->
<div id=demo style=overflow:hidden;height:100;width:600;background:#214984;color:#ffffff>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
<td id=demo1 valign=top<!--#include file="GX/PHOTOIMG.htm"-->
</td>
<td id=demo2 valign=top></td>
</tr>
</table>
</div>
-----------------------向左滚动-------------------------------
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
-----------------------向右滚动-------------------------------
<script>
var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollLeft=demo.scrollWidth
function Marquee(){
if(demo.scrollLeft<=0)
demo.scrollLeft+=demo2.offsetWidth
else{
demo.scrollLeft--
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
---------------------------------------------------------
有一点要注意的是,在实现应用中得算好高度或宽度,不然会出现滚动两次后停止的问题。
下拉框跳转
<select name="select" style="width:100px;" onchange="javascript:window.open(this.options[this.selectedIndex].value)">
<option selected>MP3音乐下载</option>
<option value="#">中国音乐网</option>
<option value="#">九天音乐网</option>
</select>
下拉框选择图片
<img width=200 height=223 src="01250.gif" name="x1">
<SELECT onChange="document.x1.src=options[selectedIndex].value">
<option value="01251.gif">看看图片1</option>
<option value="01252.gif">看看图片2</option>
<option value="01253.gif">看看图片3</option>
<option value="01254.gif">看看图片4</option>
</SELECT>