<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>左右无间断滚动效果,wj整理收集。</title>
<script language="javascript"type="text/javascript">
function marqpuee(){
vars1=document.getElementById("div1");
vars2=document.getElementById("div2");
vars3=document.getElementById("div3");
vars4=document.getElementById("div4");
s4.style.width=(s2.offsetWidth*2)+"px";
s3.innerHTML=s2.innerHTML;
if(s2.offsetWidth<=s1.scrollLeft){
s1.scrollLeft-=s2.offsetWidth;
}else{
s1.scrollLeft++;
}
}
var MyMmar=setInterval(marqpuee,20)
</script>
</head>
<body>
<span style="width:200px;display:block;">
<spanid="div1"style="width:auto;height:auto;overflow:hidden;white-space:nowrap;display:block;">
<spanid="div4" style="float:left;display:block;"><spanid="div2" style="float:left;">看下面代码前先负责上面html代码运行体  </span><spanid="div3" style="float:left;"></span></span>
</span>
<span>
<marquee scrollLeft='1' behavior='alternate'direction='left' scrollamount='6' scrolldelay='100'>看下面代码前先负责上面html代码运行体</marquee>
</body>
</html>
********************************************************************
看下面代码前先负责上面html代码运行体验一下
********************************************************************
/**
*conObj(contentObject):放置文字的组件对象
*calObj(calculationObjcet):用于计算的组件对象,即文字过长的情况下,在该组件范围内进行滚动,该组件有显式定义的长宽
* step:滚动步长,默认是文字宽度
* delay:滚动频率
* marqueeNum:文字长度上限(以半角字符为计数单位),当文字长度超过这个范围,将进行滚动操作
* content:文字内容,当conObj组件中存在该内容,该参数可以省略
*/
functionmarquee(conObj,calObj,step,delay,marqueeNum,content){ //文字过长时候的滚动操作
if(marquee.handle!=undefined)clearInterval(marquee.handle);
vartemp=(content!=undefined && typeof content=="string")?content:conObj.innerHTML;
if(marqueeNum==undefined|| getCharLength(temp)<marqueeNum){
conObj.innerHTML=temp;
return;
}
var x=0;
marquee.obj=calObj;
marquee.oldPosition=calObj.style.position;
calObj.style.position="relative";
marquee.oldOverflow=calObj.style.overflow;
calObj.style.overflow="hidden";
varw=calObj.offsetWidth;
varh=calObj.offsetHeight;
step=step?step:parseInt(getCurrentStyle(calObj,"fontSize").replace("px",""));
varfragment=document.createDocumentFragment();
for(vari=0,ilen=w;i<ilen;i+=step){
varrSpan=document.createElement("span");
rSpan.style.display="inline-block";
rSpan.style.width=step+"px";
fragment.appendChild(rSpan);
}
varlSpan=document.createElement("span");
lSpan.style.display="inline-block";
lSpan.innerHTML=temp;
varmainSpan=document.createElement("div");
mainSpan.style.position="absolute";
mainSpan.style.height=h+"px";
mainSpan.appendChild(lSpan);
mainSpan.appendChild(fragment);
mainSpan.style.left="0px";
conObj.innerHTML="";
conObj.appendChild(mainSpan);
varfinalW=mainSpan.offsetWidth;
varoldW=finalW;
marquee.handle=setInterval(function(){
x-=step;
mainSpan.style.left=x+"px";
varnewW=mainSpan.offsetWidth;
if(newW<=oldW){
conObj.innerHTML="<marqueescrollLeft='1' behavior='scroll' direction='left'scrollamount='"+step+"' scrolldelay='"+delay+"'>" +temp + "</marquee>";
clearInterval(marquee.handle);
}else{
oldW+=step;
}
},delay);
}
/**
* @descriptionsubText 汉字与字符都都在时截取长度
* @param{string} _str 需要截取的字符串
* @param{string} _subLength 页面上展示字符串的长度(汉字个数*2)
* @param{number} _num 是否滚动(num等于0时字符截取,num等于1时数据进行滚动)
*/
/*IEPG.subText = function(_str, _subLength, _num) {
var temp1= _str.replace(/[^\x00-\xff]/g, "**");
var temp2= temp1.substring(0, _subLength);
varx_length = temp2.split("\*").length - 1;
varhanzi_num = x_length / 2;
_subLength= _subLength - hanzi_num;
var res =_str.substring(0, _subLength);
if(_num ===0) {
if(_subLength< _str.length) {
res= res;
}
returnres;
} else {
if(_subLength< _str.length) {
return"<marquee scrollLeft='1' behavior='alternate' direction='left'scrollamount='6' scrolldelay='100'>" + _str +"</marquee>";
}else {
return_str;
}
}
};*/
IEPG.subText= function(_str, _subLength, _num) {
var temp1= _str.replace(/[^\x00-\xff]/g, "**");
var temp2= temp1.substring(0, _subLength);
varx_length = temp2.split("\*").length - 1;
varhanzi_num = x_length / 2;
_subLength= _subLength - hanzi_num;
var res =_str.substring(0, _subLength);
if(_num=== 0) {
if(_subLength< _str.length) {
res= res;
}
returnres;
} else {
clearInterval(myMmar);
if(_subLength< _str.length) {
myMmar=setInterval(marqpueeInt,10);
return"<span id='div1'style='width:90%;height:auto;overflow:hidden;white-space:nowrap;display:block;'><spanid='div4' style='float:left;display:block;'><span id='div2'style='float:left;'>" + _str + "  </span><spanid='div3' style='float:left;'></span></span></span>";
}else {
return_str;
}
}
};
var myMmar;
function marqpueeInt(){
vars1=document.getElementById("div1");
vars2=document.getElementById("div2");
vars3=document.getElementById("div3");
vars4=document.getElementById("div4");
s4.style.width=(s2.offsetWidth*2)+"px";
s3.innerHTML=s2.innerHTML;
if(s2.offsetWidth<=s1.scrollLeft){
s1.scrollLeft-=s2.offsetWidth;
}else{
s1.scrollLeft++;
}
}