موقع العراب

مجموعة جاهزة من الجافا سكريبت ، وسيكون هناك إضافات دائمة لسكريبتات جاهزة إن شاء الله ....

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

يتم إضافة السكريبت بالفرونت بيج تبعاً لنوعه

بعضهم يوضع بين </head> و <body>
والبعض في قسمين
<head> هنا قسم</head>
<body> آخر</body>

نص يدور حول مؤشر الماوس

<body bgcolor="#000000"> <head<head> <SCRIPT language=JavaScript>  </SCRIPT>

نص يتغير لونه عدة مرات

<div align="center"><p><script language="JavaScript1.2" type="text/javascript">    </script></p></div><br>

نص بألوان قوس قزح

<p align="center"><font size="6" face="Tahoma"><strong><script language="JavaScript">  </script>   </strong></font><font size="6"><strong><script language="JavaScript"></script></strong></font></p>

نص يظهر ثم يختفي

<HEAD> <SCRIPT LANGUAGE="JavaScript1.2">  </script> </HEAD> <BODY> <center> <div id="fader" style="width:480; Filter:Alpha(Opacity=0,FinishOpacity=0,style=2)"> <h1> <font family="Tahoma" color="maroon" size="+2"> نرحب بكم في موقعنا <p> موقع صحراء </font> </h1> </div> </center>

تغيير لون الخلفية

<FORM name="back"> <SELECT name="g" onChange="change()"> <OPTION VALUE="aqua">ازرق فاتح <OPTION VALUE="green">اخضر <OPTION VALUE="orange">برتقالي <OPTION VALUE="yellow">اصفر <OPTION VALUE="purple">بنفسجي <OPTION VALUE="gray">رصاصي <OPTION VALUE="pink">وردي <OPTION VALUE="lavender">بنفسجي فاتح <OPTION VALUE="khaki">بني فاتح <OPTION VALUE="skyblue">ازرق سماوي <OPTION VALUE="white" SELECTED>ابيض </SELECT> <INPUT TYPE="button" VALUE="اختار اللون"> </FORM> <script language="Javascript">  </script>

ألعاب نارية

<layer name="a0" left=10 top=10 visibility=show bgcolor="#ffffff" clip="0,0,1,1"></layer> <layer name="a1" left=10 top=10 visibility=show bgcolor="#fff000" clip="0,0,1,1"></layer> <layer name="a2" left=10 top=10 visibility=show bgcolor="#ffa000" clip="0,0,1,1"></layer> <layer name="a3" left=10 top=10 visibility=show bgcolor="#ff00ff" clip="0,0,1,1"></layer> <layer name="a4" left=10 top=10 visibility=show bgcolor="#00ff00" clip="0,0,1,1"></layer> <layer name="a5" left=10 top=10 visibility=show bgcolor="#ff00ff" clip="0,0,1,1"></layer> <layer name="a6" left=10 top=10 visibility=show bgcolor="#ff0000" clip="0,0,1,1"></layer> <layer name="a7" left=10 top=10 visibility=show bgcolor="#ffffff" clip="0,0,1,1"></layer> <layer name="a8" left=10 top=10 visibility=show bgcolor="#fff000" clip="0,0,1,1"></layer> <layer name="a9" left=10 top=10 visibility=show bgcolor="#ffa000" clip="0,0,1,1"></layer> <layer name="a10" left=10 top=10 visibility=show bgcolor="#ff00ff" clip="0,0,1,1"></layer> <layer name="a11" left=10 top=10 visibility=show bgcolor="#00ff00" clip="0,0,2,2"></layer> <layer name="a12" left=10 top=10 visibility=show bgcolor="#0000ff" clip="0,0,2,2"></layer> <layer name="a13" left=10 top=10 visibility=show bgcolor="#ff0000" clip="0,0,2,2"></layer> <script language="JavaScript"> /* Document firework script (By Kurt Gregg, kurt.grigg@virgin.net) Modified granted to Dynamic Drive to feature script in archive For full source and 100's more DHTML scripts, visit http://dynamicdrive.com */ if (document.all) with(document){ write('<div id="starsDiv" style="position:absolute;top:0px;left:0px">') write('<div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#ffffff;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px"></div>') write('<div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px"></div>') write('<div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px"></div>') write('</div>') } var Clrs=new Array(9) Clrs[0]='ff0000'; Clrs[1]='00ff00'; Clrs[2]='000aff'; Clrs[3]='ff00ff'; Clrs[4]='ffa500'; Clrs[5]='ffff00'; Clrs[6]='00ff00'; Clrs[7]='ffffff'; Clrs[8]='fffff0'; var sClrs=new Array(5) sClrs[0]='ffa500'; sClrs[1]='55ff66'; sClrs[2]='AC9DFC'; sClrs[3]='fff000'; sClrs[4]='fffff0'; var yBase; var xBase; var step; var currStep = 0; var Xpos = 1; var Ypos = 1; var initialStarColor='ffa000'; var Mtop=250; var Mleft=250; function Fireworks() { if (document.all) { yBase = window.document.body.offsetHeight/3; xBase = window.document.body.offsetWidth/8; } else if (document.layers) { yBase = window.innerHeight/3; xBase = window.innerWidth/8; } if (document.all) { step=5; for ( i = 0 ; i < starsDiv.all.length ; i++ ) { for (ai=0; ai < Clrs.length; ai++) { var c=Math.round(Math.random()*[ai]); } if (currStep < 90) starsDiv.all[i].style.background=initialStarColor; if (currStep > 90) starsDiv.all[i].style.background=Clrs[c]; starsDiv.all[i].style.top = Mtop + yBase*Math.sin((currStep+i*5)/3)*Math.sin(550+currStep/100) starsDiv.all[i].style.left = Mleft + yBase*Math.cos((currStep+i*5)/3)*Math.sin(550+currStep/100) } } else if (document.layers) { step = 5; for ( j = 0 ; j < 14 ; j++ ) //number of NS layers! { var templayer="a"+j for (ai=0; ai < Clrs.length; ai++) { var c=Math.round(Math.random()*[ai]); } if (currStep < 90) document.layers[templayer].bgColor=initialStarColor; if (currStep > 90) document.layers[templayer].bgColor=Clrs[c]; document.layers[templayer].top = Mtop + yBase*Math.sin((currStep+j*5)/3)*Math.sin(550+currStep/100) document.layers[templayer].left = Mleft + yBase*Math.cos((currStep+j*5)/3)*Math.sin(550+currStep/100) } } currStep+= step; //window.status=currStep; T=setTimeout("Fireworks()",5); if (currStep==220) { currStep=-10; for (n=0; n < sClrs.length; n++) { var k=Math.round(Math.random()*n); } initialStarColor=sClrs[k]; if (document.all) { Dtop=window.document.body.clientHeight-250; Dleft=xBase*3.5; Mtop=Math.round(Math.random()*Dtop); Mleft=Math.round(Math.random()*Dleft); document.all.starsDiv.style.top=Mtop+document.body.scrollTop; document.all.starsDiv.style.left=Mleft+document.body.scrollLeft; } else if (document.layers) { Dleft=window.innerWidth-100; Dtop=window.innerHeight-100; Mtop=Math.round(Math.random()*Dtop+window.pageYOffset); Mleft=Math.round(Math.random()*Dleft+window.pageXOffset); document.layers[templayer].top=Mtop; document.layers[templayer].left=Mleft; } if ((Mtop < 20) || (Mleft < 20)) { Mtop+=90; Mleft+=90; } } } if (document.all||document.layers) Fireworks(); </script>

فلاش لوني بالخلفية

تأثير آلة كاتبة

ساعة في أسفل الجهة اليمنى للصفحة

<HTML> <HEAD> <style type="text/css">  </style> <script>  </script> <TITLE>F O R M S</TITLE> </HEAD> <BODY BGCOLOR="#000000" TEXT="#7b68ee" link="#7b68ee" vlink="#7b68ee" onLoad="show2()"> <P> <BR><CENTER>انظر الى الساعة فى الجهة اليمنى</CENTER><P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR><P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR><P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR><P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR><P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <P> <BR> <script language="JavaScript"> var IW= 0; var IH= 0; var PX= 0; var PY= 0; var ZIN= 0; var us= null; var IMGW= 50; var IMGH= 25; var LSAFETY= 20; var TSAFETY= 17; function branding() { oldIW= IW; oldIH= IH; oldPX= PX; oldPY= PY; if (navigator.appName == 'Netscape') { if ((window.innerHeight != oldIH)||(window.innerWidth != oldIW)||(window.pageXOffset != oldPX)||(window.pageYOffset != oldPY)) { if (us == null) { for (i=0; i<document.layers.length; i++) { us= document.layers[i]; if (us.id == "Valley") break; } } if (us != null) { us.visibility= "hide"; IH= window.innerHeight; IW= window.innerWidth; PX= window.pageXOffset; PY= window.pageYOffset; (IH > IMGH) ? us.top= (IH+PY-(IMGH+TSAFETY)) : us.top= 0; (IW > IMGW) ? us.left= (IW+PX-(IMGW+LSAFETY)) : us.left= 0; //alert('document.layers.length: ' + document.layers.length); for (i=0; i<document.layers.length; i++) { templay= document.layers[i]; // alert('document.layers[' + i + '].id: ' + document.layers[i].id); if (templay.zIndex > ZIN) ZIN= (templay.zIndex + 1); } us.zIndex= ZIN; us.visibility= "show"; } } } else{ if (navigator.appVersion.indexOf("Mac") == -1) { if ((document.body.clientHeight != oldIH)||(document.body.clientWidth != oldIW)||(document.body.scrollLeft != oldPX)||(document.body.scrollTop != oldPY)) { alldivs= document.all.tags("DIV"); if (us == null){ for (i=0; i<alldivs.length; i++) { us= alldivs(i); if (us.id == "Valley") break; } } if (us != null){ us.style.display= "none"; IH= document.body.clientHeight; IW= document.body.clientWidth; PX= document.body.scrollLeft; PY= document.body.scrollTop; us.style.top= (IH+PY-(IMGH+TSAFETY)+12); us.style.left=(IW+PX-(IMGW+LSAFETY)+15); for (i=0; i<alldivs.length; i++){ templay= alldivs(i); if (templay.style.zIndex > ZIN) us.style.zindex= (templay.style.zIndex + 1); } us.style.display= ""; } } } } } if ((document.all) || (document.layers)){ setInterval("branding()",100); } </SCRIPT> <DIV CLASS="Watermark" ID="Watermark" STYLE="position:absolute;top:1;visibility:hide;" ALIGN="right"> <span id=tick2 class=tick2> </span> </DIV> </BODY> </HTML>

ساعة

<BODY onunload="stopTimer()" onLoad="startTimer()" > <SCRIPT>  </SCRIPT> <p> <font size=+1>Clock 2</font><hr> This clock will tell the time. The javascript updates the clock every 1000 milliseconds.<p> <CENTER><P><FORM NAME="clock"><INPUT TYPE="text" NAME="face" SIZE=11></FORM><p> </body>

تاريخ اليوم باللغة العربية