跨浏览器问题
<%@page import="com.pictureroll.entity.WordBean"%>
<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=gb2312"
pageEncoding="gb2312"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>文字滚动最终版</title>
<style type="text/css">
a:link {color: blue; text-decoration:none;}
a:visited {color:blue;text-decoration:none;}
a:hover {color: red; text-decoration:underline;}
</style>
</head>
<body>
<div id="scroll_begin">
<ul >
<%ArrayList list = (ArrayList)session.getAttribute("word");
for(int i = 0;i<list.size();i++){
WordBean wb =(WordBean) list.get(i);
%>
<li ><a href=<%=wb.getWord_url() %> target="_blank"><%=wb.getWord()%></a></li>
<br>
<%} %>
</ul>
</div>
<script language="JavaScript">
scroll_beginHeight=200;
stopscroll=false;
with(scroll_begin){
style.width=300;
style.height=120;
style.overflowX="visible";
style.overflowY="hidden";
noWrap=true;
onmouseover=new Function("stopscroll=true");
onmouseout=new Function("stopscroll=false");
}
document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');
preTop=0; currentTop=0;
function init(){
templayer.innerHTML="";
while(templayer.offsetHeight<scroll_beginHeight){
templayer.innerHTML+=scroll_begin.innerHTML;
}
scroll_begin.innerHTML=templayer.innerHTML+templayer.innerHTML;
setInterval("scrollUp()",100);
}
document.body.onload=init;
function scrollUp(){
if(stopscroll==true) return;
preTop=scroll_begin.scrollTop;
scroll_begin.scrollTop+=1;
if(preTop==scroll_begin.scrollTop){
scroll_begin.scrollTop=templayer.offsetHeight-scroll_beginHeight;
scroll_begin.scrollTop+=1;
}
}
</script>
</body>
</html>
上面的代码的文字滚动 只能支持IE，不能支持火狐，求大神帮忙解决 。。。
[解决办法]
加上单位px试试
[解决办法]
js所有和位置相关的属性最好都加上单位
[解决办法]
<!DOCTYPE HTML><html> <head> <meta charset="gb2312" /> <title></title> <style> ul { margin:100px; height:72px; border:1px solid red; overflow:hidden; } li { height:24px; line-height:24px; font-size:12px; } </style> </head> <body> <ul id="a"> <li>1-1</li> <li>1-2</li> <li>1-3</li> <li>1-4</li> </ul> <script> //document.getElementById()的最简化应用 function $(element){ if(arguments.length>1){ for(var i=0,length=arguments.length,elements=[];i<length;i++){ elements.push($(arguments[i])); } return elements; } if(typeof element=="string"){ return document.getElementById(element); }else{ return element; } } //类创建函数 var Class={ create:function(){ return function(){ this.initialize.apply(this,arguments); } } } //对象属性方法扩展 Function.prototype.bind=function(object){ var method=this; return function(){ method.apply(object,arguments); } } var Scroll=Class.create(); Scroll.prototype={ //第一个参数定义要滚动的区域,第二个参数定义每次滚动的高度 initialize:function(element,height,delay){ this.element=$(element); this.element.innerHTML+=this.element.innerHTML; this.height=height; this.delay=delay*1000; this.maxHeight=this.element.scrollHeight/2; this.counter=0; this.scroll(); this.timer=""; this.element.onmouseover=this.stop.bind(this); this.element.onmouseout=function(){this.timer=setTimeout(this.scroll.bind(this),1000);}.bind(this); }, scroll:function(){ if(this.element.scrollTop<this.maxHeight){ this.element.scrollTop++; this.counter++; }else{ this.element.scrollTop=0; this.counter=0; } if(this.counter<this.height){ this.timer=setTimeout(this.scroll.bind(this),5); }else{ this.counter=0; this.timer=setTimeout(this.scroll.bind(this),this.delay); } }, stop:function(){ clearTimeout(this.timer); } } new Scroll('a', 24, .2) </script> </body></html>