برای اجرای کد طبق مراحل زیر پیش می رویم
1. ابتدا کد مورد نظر را به بخش body قالب خود اضافه کنید
2. برای تغییر متن ها خاصیت text را بیابید و متن های درون تمامی آن ها را تغییر دهید به عنوان مثال متن زیر را تغییر دهید
Welcome to our letter magnet
3. برای تغییر رنگ متن ها textsplashcolors را پیدا کرده و رنگ درون آنها را تغییر دهید
به عنوان مثال رنگ red را به green تغییر دهید
4. var textfontsize اندازه متن
کد: انتخاب همه
<script>
// CREDITS:
// Letter Magnet
// By Peter Gehrig
// Copyright (c) 2011 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.fabulant.com
// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a highly visible link to
// http://www.fabulant.com on the webpage
// where this script will be featured
// CONFIGURATION:
// Go to http://www.fabulant.com
// and create your own text animation
// with our new Text Factory.
var text=new Array()
var textsplashcolors=new Array()
///////////////////////////////////////////////////////////
// SCRIPT-CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////
// Your messages. Add as many message as you like
text[0]="Welcome to our letter magnet."
text[1]="Impress your visitors!"
text[2]="Add some fun to your messages."
text[3]="Install this text script."
text[4]="No programming skills are required."
// The colors of the letters. Add as many colors as you like
textsplashcolors[0]="red"
textsplashcolors[1]="#0F0273"
textsplashcolors[2]="#0F0273"
textsplashcolors[3]="#0F0273"
textsplashcolors[4]="#0F0273"
// the font
var textfont="Arial"
// the font-size (pt)
var textfontsize=12
// the pause between the messages (seconds)
var textpause=3
// width of ticker, pixels
var ticker_width=420
// height of ticker, pixels
var ticker_height=40
// height of the spreading zone
var spread_height=15
// weight. Set this value to normal or bold
var textweight="bold"
// style. Set this value to normal or italic
var textitalic="normal"
///////////////////////////////////////////////////////////
// SCRIPT-CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////
// Do not edit below this line
var textalignabsolute="topcenter"
var letterwidth=new Array()
var messagewidth=0
var messageheight=0
var i_colors=0
var timer
var i_text=0
var textsplitted
var i_textpath=0
var endpause=1
var endpausemilli=endpause*10
var maxtextlength=0
var i_endposition=0
var windowwidth=0
var windowheight=0
var windowwidthfactor=1
var windowheightfactor=1
var i_span=0
var startposmax_x=0
var startposmax_y=0
textpause*=1000
var x_step=new Array()
var y_step=new Array()
var x_finalpos=new Array()
var y_finalpos=0
var max_loop=20
var i_loop=0
var ns4=document.layers?1:0
var ns6=document.getElementById&&!document.all?1:0
var ie=document.all?1:0
for (i=0;i<=text.length-1;i++) {
if (text[I].length>=maxtextlength) {maxtextlength=text[I].length}
}
for (i=0;i<=text.length-1;i++) {
text[I]=text[I]+" "
}
var xpos=new Array()
for (i=0;i<=maxtextlength;i++) {
xpos[I]=-5000
}
var ypos=new Array()
for (i=0;i<=maxtextlength;i++) {
ypos[I]=-5000
}
function randomizer(range) {
return Math.floor(range*Math.random())
}
function getpagesize() {
if (ie) {
windowheight=parseInt(document.body.clientHeight)
windowwidth=parseInt(document.body.clientWidth)
}
if (ns6) {
windowheight=parseInt(window.innerHeight)
windowwidth=parseInt(window.innerWidth)
}
startposmax_x=ticker_width
startposmax_y=spread_height*ticker_height
changecontent()
}
function changecontent() {
messagewidth=0
var textsa=text[i_text]
textsplitted=textsa.split("")
for (i=0;i<=textsplitted.length-1;i++) {
var thisspan=eval("document.getElementById('span"+i+"')")
thisspan.innerHTML="<span style='font-family:"+textfont+";font-size:"+textfontsize+"pt;font-style:"+textitalic+";font-weight:"+textweight+";color:"+textsplashcolors[i_colors]+"'>"+textsplitted[I]+"</span>"
i_colors++
if (i_colors>textsplashcolors.length-1) {i_colors=0}
letterwidth[I]=Math.round(parseInt(thisspan.offsetWidth)*1.2)
if (letterwidth[I]==0) {letterwidth[I]=textfontsize}
messagewidth+=letterwidth[I]
messageheight=Math.round(document.getElementById('span0').offsetHeight)
}
i_text++
if (i_text>=text.length) {i_text=0}
getfinalpos()
}
function getfinalpos() {
var padding_x=0
var padding_y=0
x_finalpos[0]=0
y_finalpos=0
for (i=1;i<textsplitted.length-1;i++) {
x_finalpos[I]=x_finalpos[i-1]+letterwidth[i-1]
}
gotostartpos()
}
function gotostartpos() {
for (i=0;i<textsplitted.length-1;i++) {
var thisspan=eval("document.getElementById('span'+i).style")
thisspan.left=randomizer(startposmax_x)+"px"
thisspan.top=randomizer(startposmax_y)+"px"
}
gotostandstillpos()
}
function gotostandstillpos() {
if (i_loop<=max_loop-1) {
for (i=0;i<textsplitted.length-1;i++) {
var thisspan=eval("document.getElementById('span"+i+"').style")
x_step[I]=(x_finalpos[I]-parseInt(thisspan.left))/(max_loop-i_loop)
y_step[I]=(y_finalpos-parseInt(thisspan.top))/(max_loop-i_loop)
thisspan.left=(parseInt(thisspan.left)+x_step[I])+"px"
thisspan.top=(parseInt(thisspan.top)+y_step[I])+"px"
}
i_loop++
var timer=setTimeout("gotostandstillpos()",20)
}
else {
i_loop=0
clearTimeout(timer)
timer=setTimeout("gotoendpos()",textpause)
}
}
function gotoendpos() {
if (i_loop<=textsplitted.length-1) {
var thisspan=eval("document.getElementById('span"+i_loop+"').style")
thisspan.left=-1000+"px"
i_loop++
var timer=setTimeout("gotoendpos()",10)
}
else {
clearTimeout(timer)
i_loop=0
changecontent()
}
}
document.write("<div id='roofmagnet' style='position:relative;width:"+ticker_width+"px;height:"+ticker_height+"px'>")
for (i=0;i<=maxtextlength;i++) {
document.write("<span id='span"+eval(i)+"' style='position:absolute;'>")
document.write("</span>")
}
document.write("</div>")
window.onload=getpagesize
</script>