کدباکس متحرک زیبا

کد باکس متن متحرک با استایل بسیار زیبا

کد باکس متن متحرک با استایل بسیار زیبا  امروز کد باکس متحرک متن با استایل جدید

براتون اماده کردم که این کد در جای مناسبی از سایت و یا وبلاگ خود قرارداده و جلوه زیبا به سایت خود دهید.

شما میتوانید این کد را در صفحات جداگانه,قالب سایت,مطلب و… استفاده نمایید.

دمو کد

<center>
<script language="javascript">
//ENTER CONTENT TO SCROLL BELOW.
var content='متن شما';

var boxheight=35;        // BACKGROUND BOX HEIGHT IN PIXELS.
var boxwidth=400;        // BACKGROUND BOX WIDTH IN PIXELS.
var boxcolor="#ffedcf";  // BACKGROUND BOX COLOR.
var speed=40;            // SPEED OF SCROLL IN MILLISECONDS (1 SECOND=1000 MILLISECONDS)..
var pixelstep=2;         // PIXELS "STEPS" PER REPITITION.

//** DO NOT EDIT BEYOND THIS POINT **
var outer, inner, elementwidth;
var goingright=true;
var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;

function getElWidth(el){
if(ns4)return (el.document.width)? el.document.width : el.clip.right-el.clip.left;
else if(ie4||ie5)return (el.style.width)? el.style.width:el.clientWidth;
else if(w3c)return (el.style.width)?parseInt(el.style.width):parseInt(el.offsetWidth);
else return -1;
}
var txt='';
if(ns4){
txt+='<table border=0 cellpadding=0 cellspacing=0  width='+boxwidth+' height='+boxheight+'><tr><td>';
txt+='<ilayer name="outer" bgcolor="'+boxcolor+'" visibility="visible" width="'+boxwidth+'" height="'+boxheight+'" clip="'+boxheight+'">';
txt+='<layer  name="inner" visibility="hidden" left="2" top="2">';
txt+=content;
txt+='</layer></ilayer></td></tr></table>';
}else{
txt+='<div id="outer" style="position:relative; width:'+boxwidth+'; height:'+boxheight+'; visibility:visible; background-color:'+boxcolor+'; overflow:hidden; text-align:left" >';
txt+='<div id="inner"  style="position:absolute; visibility:hidden; left:2px; top:2px; overflow:hidden">';
txt+=content;
txt+='</div></div>';
}
document.write(txt);

function init(){
inner=(ns4)?document.layers['outer'].document.layers['inner']:(ie4)?document.all['inner']:document.getElementById('inner');
elementwidth=Math.min(boxwidth-4,getElWidth(inner));
if(ns4){
document.layers['outer'].clip.height=boxheight;
document.layers['outer'].clip.width=boxwidth;
inner.clip.width=elementwidth;
inner.clip.height=boxheight-4;
inner.visibility="show";
}else{
inner.style.clip='rect(0px, '+elementwidth+'px, '+(boxheight-4)+'px, 0px)';
inner.style.visibility="visible";
}
goingright=true;
setInterval('bouncescroll()',speed);
}

function bouncescroll(){
if(ns4){
if(inner.left>=(boxwidth-elementwidth))goingright=false;
if(inner.left<=2)goingright=true;
inner.left=(goingright)?inner.left+pixelstep :inner.left-pixelstep;
}else{
if(parseInt(inner.style.left)>=(boxwidth-elementwidth))goingright=false;
if(parseInt(inner.style.left)<=2)goingright=true;
inner.style.left=((goingright)? parseInt(inner.style.left)+pixelstep: parseInt(inner.style.left)-pixelstep)+'px';
}}

window.onload=init;
</script>