تكنلوجيا: جافا سكربت

كود تحديد اتجاه النص

كود التحكم فى حجم الخط ولونه ونوعه

كود نص يتحرك لأعلى

كود نص يتمدد وينكمش

كود نص متأرجح يميناً ويسارا

كود إظهار نصوص بها روابط بالتناوب

<div style="position:relative;center:0px;top:0px">
<span id="highlighter" style="position:absolute;left:0;top:0;font-size:18px;font-family:Verdana;background-color:yellow;clip:rect(0px 0px auto 0px)"></span>
</div>
<script type="text/javascript">
var tickercontents=new Array()
tickercontents[0]='اكتب هنا نص عادي دون روابط <a href="الرابط الذي سيوضع فوق النص ">text</a>'
tickercontents[1]='اكتب هنا نص عادي رقم 1 دون روابط <a href="الرابط الذي سيوضع فوق النص 1">text</a>'
tickercontents[2]='اكتب هنا نص عادي رقم 2 دون روابط <a href="الرابط الذي سيوضع فوق النص 2">text</a>'
tickercontents[3]='اكتب هنا نص عادي رقم 3 دون روابط <a href="الرابط الذي سيوضع فوق النص 3">text</a>'
var tickdelay=3000 //delay btw messages
var highlightspeed=10 //10 pixels at a time.

////Do not edit pass this line////////////////

var currentmessage=0
var clipwidth=0

function changetickercontent(){
crosstick.style.clip="rect(0px 0px auto 0px)"
crosstick.innerHTML=tickercontents[currentmessage]
highlightmsg()
}

function highlightmsg(){
var msgwidth=crosstick.offsetWidth
if (clipwidth<msgwidth){
clipwidth+=highlightspeed
crosstick.style.clip="rect(0px "+clipwidth+"px auto 0px)"
beginclip=setTimeout("highlightmsg()",20)
}
else{
clipwidth=0
clearTimeout(beginclip)
if (currentmessage==tickercontents.length-1) currentmessage=0
else currentmessage++
setTimeout("changetickercontent()",tickdelay)
}
}

function start_ticking(){
crosstick=document.getElementById? document.getElementById("highlighter") : document.all.highlighter
crosstickParent=crosstick.parentNode? crosstick.parentNode : crosstick.parentElement
if (parseInt(crosstick.offsetHeight)>0)
crosstickParent.style.height=crosstick.offsetHeight+'px'
else
setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'px'",100) //delay for Mozilla's sake
changetickercontent()
}

if (document.all || document.getElementById)
window.onload=start_ticking

</script>

كود نص متحرك

كود شريط متحرك مع روابط

كود نص يضئ بالتدريج

var message="اكتب النص هنا"
var neonbasecolor="gray"
var neontextcolor="yellow"
var flashspeed=100  //in milliseconds

///No need to edit below this line/////

var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)

function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}

function neon(){

//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
//eval("document.all.neonlight"+m).style.color=neonbasecolor
crossref(m).style.color=neonbasecolor
}

//cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor

if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",1500)
return
}
}

function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()

</script>
</h2>
</font></p>

كود نص يضئ بألوان مختلفة

كود إضافة صورة

كود صورة مع رابط

كود تغيير الصور تلقائيا

<center>
<style type="text/css">
#pscroller1{
font-size: 14px;
font-family: Tahoma;
width: 250px;
height: 250px;
border: 0px solid black;
padding: 5px;
background-color: white;
}

</style>

/*Example message arrays for the two demo scrollers*/

var pausecontent=new Array()
pausecontent[0]='<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_ZkmoCgPBnh0rsJh6nXEsseUNuL66_XDicefj-yPhfRKARqA59qiw41bEHiOeyLNRzSMHpmz7hEyhZeOB-rSBpApetP7YjeMAzwHsGHpNcPyMbuBIp_amQ19PbaTFYXZdY-abAEB826Iu/s125/%2525D8%2525A8%2525D8%2525A7%2525D9%252586%2525D8%2525B1-%2525D8%2525AC%2525D8%2525AF%2525D9%25258A%2525D8%2525AF.gif">'
pausecontent[1]='<img border="0" src="رابط الصورة 2">'
pausecontent[2]='<img border="0" src="رابط الصورة 3">'
pausecontent[3]='<img border="0" src="رابط الصورة 1">'
</script>

/***********************************************
* Pausing up-down scroller- © Dynamic Drive (www.dynamicdrive.com)
***********************************************/

// -------------------------------------------------------------------
// initialize()- Initialize scroller method.
// -Get div objects, set initial positions, start up down animation
// -------------------------------------------------------------------

pausescroller.prototype.initialize=function(){
this.tickerdiv=document.getElementById(this.tickerid)
this.visiblediv=document.getElementById(this.tickerid+"1")
this.hiddendiv=document.getElementById(this.tickerid+"2")
this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv))
//set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px"
this.getinline(this.visiblediv, this.hiddendiv)
this.hiddendiv.style.visibility="visible"
var scrollerinstance=this
document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1}
document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0}
if (window.attachEvent) //Clean up loose references in IE
window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null})
setTimeout(function(){scrollerinstance.animateup()}, this.delay)
}

// -------------------------------------------------------------------
// animateup()- Move the two inner divs of the scroller up and in sync
// -------------------------------------------------------------------

pausescroller.prototype.animateup=function(){
var scrollerinstance=this
if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){
this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px"
this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px"
setTimeout(function(){scrollerinstance.animateup()}, 50)
}
else{
this.getinline(this.hiddendiv, this.visiblediv)
this.swapdivs()
setTimeout(function(){scrollerinstance.setmessage()}, this.delay)
}
}

// -------------------------------------------------------------------
// swapdivs()- Swap between which is the visible and which is the hidden div
// -------------------------------------------------------------------

pausescroller.prototype.swapdivs=function(){
var tempcontainer=this.visiblediv
this.visiblediv=this.hiddendiv
this.hiddendiv=tempcontainer
}

pausescroller.prototype.getinline=function(div1, div2){
div1.style.top=this.visibledivtop+"px"
div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px"
}

// -------------------------------------------------------------------
// setmessage()- Populate the hidden div with the next message before it's visible
// -------------------------------------------------------------------

pausescroller.prototype.setmessage=function(){
var scrollerinstance=this
if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it)
setTimeout(function(){scrollerinstance.setmessage()}, 100)
else{
var i=this.hiddendivpointer
var ceiling=this.content.length
this.hiddendivpointer=(i+1>ceiling-1)? 0 : i+1
this.hiddendiv.innerHTML=this.content[this.hiddendivpointer]
this.animateup()
}
}
pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any
if (tickerobj.currentStyle)
return tickerobj.currentStyle["paddingTop"]
else if (window.getComputedStyle) //if DOM2
return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top")
else
return 0
}
</script>
<script type="text/javascript">
//new pausescroller(name_of_message_array, CSS_ID, CSS_classname, pause_in_miliseconds)
new pausescroller(pausecontent, "pscroller1", "someclass", 3000)
document.write("<br />")
</script>
</center>

كود صور متحركة

كود شريط الصور المتحرك مع روابط
يمكن التحكم فى طول وعرض الصور بتغيير قيمها يدويا وتغيير إتجاه الشريط بتغيير كلمة up بالكود إلى down أو right أو lift

كود إضافة رابط

فتح الرابط في نافذة جديدة blank
او في نفس الصفحة self

لون الرابط

كود وضع الفلاش

كود إضافة صفحة موقع داخل صفحة موقعك

سكربت طباعة الصفحة

سكريبت آلة حاسبة

بدون لون

الصفحات

جافا سكربت