کد متن متحرک

سلام 

این کد کاربردی واسه اینه که شاید شما بخواید متنتون متحرک باشه چند نوع مختلف میزارم ک هر نوعی ک با وبلاگتون ست هست رو کپی کنید

نکته: این کدو هرجا کپی کنی جواب میده هم تو قالب هم پست ارسالی و کاملا تست شده

نوع اول:

متن شما....

برای دریافت کد متن توی باکس رو کپی کنید

<p><br></p><textarea style="width: 300px; height: 32px;"> <marquee behavior="scroll" direction="left">متن شما....</marquee>
</textarea>

نوع دوم

متن شما ...

برای دریافت کد متن توی باکس رو کپی کنید

<style style="text/css">
.marquee {
 height: 50px; 
 overflow: hidden;
 position: relative;
}
.marquee p {
 position: absolute;
 width: 100%;
 height: 100%;
 margin: 0;
 line-height: 50px;
 text-align: center;
 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%); 
 transform:translateX(100%);
 /* Apply animation to this element */ 
 -moz-animation: scroll-left 5s linear infinite;
 -webkit-animation: scroll-left 5s linear infinite;
 animation: scroll-left 5s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes scroll-left {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes scroll-left {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes scroll-left {
 0%   { 
 -moz-transform: translateX(100%); /* Browser bug fix */
 -webkit-transform: translateX(100%); /* Browser bug fix */
 transform: translateX(100%);   
 }
 100% { 
 -moz-transform: translateX(-100%); /* Browser bug fix */
 -webkit-transform: translateX(-100%); /* Browser bug fix */
 transform: translateX(-100%); 
 }
}
</style>
<div class="marquee">
<p>متن شما...</p>
</div>

نوع سوم

متن شما... برای دریافت کد متن توی باکس رو کپی کنید

<marquee behavior="alternate">متن شما....</marquee>

توجه نوع سوم شبی نوع اوله اما یهو ناپدید نمیشه

نوع چهارم

متن شما...

<marquee behavior="scroll" direction="down">Scroll down...</marquee>

نوع پنجم

متن شما...

<marquee behavior="scroll" direction="left">متن شما...</marquee>

نوع اخر

متن شما...

<style style="text/css">
.horizontally {
 height: 50px; 
 overflow: hidden;
 position: relative;
 background: yellow;
 color: orange;
 border: 1px solid orange;
}
.horizontally p {
 position: absolute;
 width: 100%;
 height: 100%;
 margin: 0;
 line-height: 50px;
 text-align: center;
 /* Starting position */
 -moz-transform:translateX(50%);
 -webkit-transform:translateX(50%); 
 transform:translateX(50%);
 /* Apply animation to this element */ 
 -moz-animation: horizontally 5s linear infinite alternate;
 -webkit-animation: horizontally 5s linear infinite alternate;
 animation: horizontally 5s linear infinite alternate;
}
/* Move it (define the animation) */
@-moz-keyframes horizontally {
 0%   { -moz-transform: translateX(50%); }
 100% { -moz-transform: translateX(-50%); }
}
@-webkit-keyframes horizontally {
 0%   { -webkit-transform: translateX(50%); }
 100% { -webkit-transform: translateX(-50%); }
}
@keyframes horizontally {
 0%   { 
 -moz-transform: translateX(50%); /* Browser bug fix */
 -webkit-transform: translateX(50%); /* Browser bug fix */
 transform: translateX(50%);   
 }
 100% { 
 -moz-transform: translateX(-50%); /* Browser bug fix */
 -webkit-transform: translateX(-50%); /* Browser bug fix */
 transform: translateX(-50%); 
 }
}
</style>
<div class="horizontally">
<p>متن شما...</p>
</div>

امیدوارم از مطلب ما خوشتون بیاد لطفا وبلاگ ما رو ب دوستانتون معرفی کنید و با نظر دادن برای هرچی بهتر شدن و کد های جدید ما را یاری کنید