کدهای جاوا اسکریپت

خدمات وب:

»» به هنگام استفاده از کدها به موارد ذیل توجه نمایید:

راهنمای استفاده از هر کد با آیکن مشخص شده است.
برای مشاهده عملکرد هر کد روی آیکن کلیک نمایید.
هنگام استفاده از هر کد به عملکرد آن در مرورگرهای مختلف توجه نمایید.
پیش فرض استفاده از کدها بدون بکارگیری <...DOCTYPE!> میباشد. لذا در صورت استفاده از <...DOCTYPE!> در مرورگرهای مختلف عملکرد کد انتخابی خود را بررسی نمایید.
روش انتخاب سریعتر کدها (مناسب برای کدهای بلند):
به ابتدای کد رفته و کلیک کنید. حال به انتهای کد رفته، دکمه Shift را پایین نگه داشته و کلیک کنید. کد مورد نظر شما به طور کامل انتخاب میشود.
جهت مشاهده عملکرد کدها، کد انتخابی را در Notepad کپی کرده و با پسوند html ذخیره نمایید.
برای پیشگیری از هر گونه به هم ریختگی در نمایش متنهای فارسی Encoding صفحه را روی utf-8 تنظیم نمایید.

» جدیدترین اسکریپت ها:

محدود کردن حروف و کاراکترهای ورودی در فیلدهای یک فرم | 26/8/88
قرار دادن لوگوی سایت در صفحه به صورت ایستا | 24/8/88

محدود کردن تعداد حروف و کاراکترهای ورودی در فیلدهای یک فرم FF1+, IE6+, Opr8+ |

<head>
<style type="text/css">

.progress{
width: 1px;
height: 14px;
color: white;
font-size: 12px;
overflow: hidden;
background-color: navy;
padding-left: 5px;
}

</style>

// trim the extra text
if (charcnt > maxlimit) {
field.value = field.value.substring(0, maxlimit);
}

else {
// progress bar percentage
var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ;
document.getElementById(counter).style.width = parseInt((fieldWidth*percentage)/100)+"px";
document.getElementById(counter).innerHTML="Limit: "+percentage+"%"
// color correction on style from CCFFF -> CC0000
setcolor(document.getElementById(counter),percentage,"background-color");
}
}

function setcolor(obj,percentage,prop){
obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)";
}
</script>
</head>

<body>
<form>
<textarea rows="5" cols="40" name="maxcharfield" id="maxcharfield"
onKeyDown="textCounter(this,'progressbar1',20)"
onKeyUp="textCounter(this,'progressbar1',20)"
onFocus="textCounter(this,'progressbar1',20)" ></textarea><br />

</form>
</body>

قرار دادن لوگوی سایت در صفحه به صورت ایستا FF1+, IE6+, Opr8+ |

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="staticlogo.js"></script>
</head>

» پس از دانلود فایل ضمیمه، کد زیر را که مربوط به موقعیت لوگو در صفحه و آدرس تصویر لوگو میباشد را با لوگوی مورد نظر خود اصلاح و جایگزین نمایید.

setting: {orientation:4, visibleduration:20000, fadeduration:[1000, 500]}, //orientation=1|2|3|4, duration=millisec, fadedurations=millisecs
offsets: {x:10, y:10},//offset of logo relative to window corner
logoHTML: '<a href="http://www.webkaran.com" title="webkaran"><img src="logo.gif" style="width:50px; height:47px; border:0" /></a>', //HTML for logo, which is auto wrapped in DIV w/ ID="mysitelogo"

فایل ضمیمه: staticlogo.js

تغییر تصویر پس زمینه (Background) صفحه با انتخاب کاربر IE 6+ , Opera 9+ |

<head>
<style>
.bgimages img {cursor:hand}
</style>
<script language="JavaScript1.2">

</script>
</head>

<body>
<span class="bgimages" onClick="tile();event.cancelBubble=true"><img src="backgr10.jpg"><img src="backgr11.jpg"><img src="backgr13.jpg"><img src="backgr14.jpg"></span>
</body>

نمایش پیغام متحرک در صفحه متناسب با اسکرول شدن صفحه IE 6+ , FF 1+ , Opera 9+ |

topmsg.js :دانلود فایل ضمیمه

بارش برگ پاییزی در صفحه IE 6+ , FF 1+ , Opera 9+ |

//Autumn leaves- by Kurt Grigg (kurt.grigg@virgin.net)
//Modified by Dynamic Drive for NS6 functionality
//visit http://www.dynamicdrive.com for this script

//Pre-load your image below!
grphcs=new Array(6)
Image0=new Image();
Image0.src=grphcs[0]="img9.gif";
Image1=new Image();
Image1.src=grphcs[1]="img8-01.gif"
Image2=new Image();
Image2.src=grphcs[2]="img8-02.gif"
Image3=new Image();
Image3.src=grphcs[3]="img8-03.gif"
Image4=new Image();
Image4.src=grphcs[4]="img8-04.gif"
Image5=new Image();
Image5.src=grphcs[5]="img8-05.gif"

Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
ns6=(document.getElementById&&!document.all)?1:0;

if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px; z-index:100"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
for (i=0; i < Amount; i++){
Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()*WinWidth);
Speed[i]= Math.random()*5+3;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
function fall(){
var WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;
var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < Amount; i++){
sy = Speed[i]*Math.sin(90*Math.PI/120);
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] > WinHeight){
Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=Math.random()*5+3;
}
if (ns){
document.layers['sn'+i].left=Xpos[i];
document.layers['sn'+i].top=Ypos[i]+hscrll;
}
else if (ns6){
document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i]);
document.getElementById("si"+i).style.top=Ypos[i]+hscrll;
}
else{
eval("document.all.si"+i).style.left=Xpos[i];
eval("document.all.si"+i).style.top=Ypos[i]+hscrll;
}
Cstep[i]+=Step[i];
}
setTimeout('fall()',30);
}

window.onload=fall
//-->
</script>

قرار دادن توضیح برای متن یا قسمتی از آن IE 6+ , FF 1+ , Opera 9+ |

<head>
<style type="text/css">

#dhtmltooltip{
position: absolute;
width: 150px;
border: 1px solid #444444;
padding: 2px;
background-color: #ffffdd;
visibility: hidden;
z-index: 100;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
/*filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=125);*/
}

#dhtmlpointer{
position:absolute;
z-index: 101;
visibility: hidden;
}
</style>
<script type="text/javascript">

var offsetfromcursorX=12 //Customize x offset of tooltip
var offsetfromcursorY=10 //Customize y offset of tooltip

var offsetdivfrompointerX=10 //Customize x offset of tooltip DIV relative to pointer image
var offsetdivfrompointerY=12 //Customize y offset of tooltip DIV relative to pointer image. Tip: Set it to (height_of_pointer_image-1).

document.write('<div id="dhtmltooltip"></div>') //write out tooltip DIV
document.write('<img id="dhtmlpointer" src="../images/spacer.gif">') //write out pointer image

var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

var pointerobj=document.all? document.all["dhtmlpointer"] : document.getElementById? document.getElementById("dhtmlpointer") : ""

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function ddrivetip(thetext, thewidth, thecolor){
if (ns6||ie){
if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
tipobj.innerHTML=thetext
enabletip=true
return false
}
}

function positiontip(e){
if (enabletip){
var nondefaultpos=false
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var winwidth=ie&&!window.opera? ietruebody().clientWidth : window.innerWidth-20
var winheight=ie&&!window.opera? ietruebody().clientHeight : window.innerHeight-20

var rightedge=ie&&!window.opera? winwidth-event.clientX-offsetfromcursorX : winwidth-e.clientX-offsetfromcursorX
var bottomedge=ie&&!window.opera? winheight-event.clientY-offsetfromcursorY : winheight-e.clientY-offsetfromcursorY

var leftedge=(offsetfromcursorX<0)? offsetfromcursorX*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth){
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=curX-tipobj.offsetWidth+"px"
nondefaultpos=true
}
else if (curX<leftedge)
tipobj.style.left="5px"
else{
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetfromcursorX-offsetdivfrompointerX+"px"
pointerobj.style.left=curX+offsetfromcursorX+"px"
}

//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight){
tipobj.style.top=curY-tipobj.offsetHeight-offsetfromcursorY+"px"
nondefaultpos=true
}
else{
tipobj.style.top=curY+offsetfromcursorY+offsetdivfrompointerY+"px"
pointerobj.style.top=curY+offsetfromcursorY+"px"
}
tipobj.style.visibility="visible"
if (!nondefaultpos)
pointerobj.style.visibility="visible"
else
pointerobj.style.visibility="hidden"
}
}

function hideddrivetip(){
if (ns6||ie){
enabletip=false
tipobj.style.visibility="hidden"
pointerobj.style.visibility="hidden"
tipobj.style.left="0px"
tipobj.style.backgroundColor=''
tipobj.style.width=''
}
}

document.onmousemove=positiontip

</script>
</head>

<body>
<div align="center">
<a href="#" OnMouseover="ddrivetip('Cool DHTML Tooltip', 200)" OnMouseout="hideddrivetip()">>> Cool DHTML Tooltip <<</a></div>
</body>

نمایش صفحه با منوی آبشاری IE 6+ , FF 1+ , Opera 9+ |

<form name="jumpy" >
<select name="example" size="1" onChange="gone()">

<option value="http://www.yahoo.com" selected>Yahoo</option>
<option value="http://www.google.com">Google</option>
<option value="http://www.amazon.com">Amazon</option>
<option value="http://www.AltaVista.com">AltaVista</option>
</select>

</div>

/////NO NEED TO EDIT BELOW HERE////////////

if (displaymode==0)
document.write(iframecode)

function gone(){
var selectedurl=document.jumpy.example.options[document.jumpy.example.selectedIndex].value
if (document.getElementById&&displaymode==0)
document.getElementById("external").src=selectedurl
else if (document.all&&displaymode==0)
document.all.external.src=selectedurl
else{
if (!window.win2||win2.closed)
win2=window.open(selectedurl)
//else if win2 already exists
else{
win2.location=selectedurl
win2.focus()
}
}
}
//-->
</script>

گالری تصاویر به صورت متحرک (حرکت به صورت افقی) IE 6+ , FF 1+, Opera 9+ |

<head>

#motioncontainer {
WIDTH: 50%; height: 142px
}
#motioncontainer A IMG {
BORDER-RIGHT: #aaaaaa 1px solid; BORDER-TOP: #aaaaaa 1px solid; BORDER-LEFT: #aaaaaa 1px solid; BORDER-BOTTOM: #aaaaaa 1px solid
}
#motioncontainer A:hover IMG {
BORDER-RIGHT: black 1px dashed; BORDER-TOP: black 1px dashed; BORDER-LEFT: black 1px dashed; BORDER-BOTTOM: black 1px dashed
}
#statusdiv {
BORDER-RIGHT: gray 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: gray 1px solid; PADDING-LEFT: 2px; LEFT: -300px; VISIBILITY: hidden; PADDING-BOTTOM: 2px; BORDER-LEFT: gray 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: gray 1px solid; POSITION: absolute; background-color:#ffffcc
}
#motioncontainer A:hover {
COLOR: #cc0000
}
</style>
</head>

<body>

</div>
</div>
</body>

motiongallery.js :دانلود فایل ضمیمه

کد جلوگیری کردن از right click (بدون پیغام) IE 6+ |

دکمه ای برای پرینت از صفحه IE 6+ , FF 1+ , Opera 9+ |

<script language="JavaScript">
if (window.print) {
document.write(' '
+ '<input type=button name=print value="Click" '
+ 'onClick="javascript:window.print()"> To Print this page!');
}
// End -->
</script>

پيام صبح بخير و ... به طور خودکار و به نسبت زماني IE 6+ , FF 1+ , Opera 9+ |

<center>
<script language="JavaScript" type="text/javascript">

</script>
</center>

نمايش تاريخ و ساعت در استاتوس بار IE 6+ , Opera 9+ |

<head>
<script language="javascript">
function runClock() {
theTime = window.setTimeout("runClock()", 1000);
var today = new Date();
var display = today.toLocaleString();
window.status = display;
}
runClock();
</script>
</head>

حرکت عنوان سایت یا وبلاگ IE 6+ , FF 1+ , Opera 9+ |

قرار صفحه به عنوان صفحه خانگی مرورگر IE 6+ |

<a href="javascript:history.go(0)" onClick="javascript:this.style.behavior='url(#default#homepage)';this.setHomePage ('http://www.webkaran.com');" TARGET="_self">اين صفحه را خانگي صفحه ي خانگي خود کنيد</a>

نوشتن متن داخل یک فیلد IE 6+ , FF 1+ , Opera 9+ |

<head>
<script language="javascript" type="text/javascript">
dayInfo = new Array
dayInfo[2] = "Dad's Birthday"
dayInfo[5] = "Rehearsal Dinner"
dayInfo[6] = "Wedding Day"
function showInfo(thisDay) {
document.calendar.dateInfo.value = dayInfo[thisDay]
}
</script>
</head>

<body>
<a href="javascript:showInfo(2)">Sample 1</a>
<br>
<a href="javascript:showInfo(5)">Sample 2 </a>
<br>
<a href="javascript:showInfo(6)">Sample 3 </a>
<p>
<form name="calendar">
<input name="dateInfo" size="20">
</form>
</body>

تغییر مداوم رنگ لینکها در سایت یا وبلاگ IE 6 + , Opera 9+ |

شمارنده صفحه IE 6+ , FF 1+ , Opera 9+ |

<script language="javascript" type="text/javascript">

</SCRIPT>

چک باکسی که با فعال کردن آن لینکها در صفحه جدید باز میشود IE 6+ , FF 1+ , Opera 9+ |

<head>
<script language="javascript" type="text/javascript">
var newwindow="_blank"

function inithyperlinks(){ //DynamicDrive.com added routine
if (document.targetform.targetnew.checked)
hyperlinks(true)
}

window.onload=inithyperlinks

// -->
</SCRIPT>
</head>

<body>
<FORM name="targetform"><INPUT TYPE="checkbox" NAME="targetnew" ONCLICK="hyperlinks(this.checked)" checked> <b>Open links in secondary window</b></FORM>
<p><a href="http://WWW.WEBKARAN.COM">WWW.WEBKARAN.COM</a></p>
</body>

جستجوی گوگل در سایت یا وبلاگ IE 6+ , FF 1+ , Opera 9+ |

<center>
<FORM method=GET action="http://www.google.com/search" target="_blank">
<TABLE bgcolor="#FFFFFF"><tr><td>
<INPUT TYPE=text name=q size=30 maxlength=255 value="">
<INPUT TYPE=hidden name=hl value="en">
<INPUT type=submit name=btnG VALUE="Google Search">
</td></tr></TABLE>
</FORM>
</center>

تقویم میلادی با جدول بندی IE 6+ , FF 1+ , Opera 9+ |

جلوگیری از انتخاب متن IE 6+ , FF 1+ |

دکمه ای برای بستن پنجره | IE 6+ , FF 1+ , Opera 9

<BODY> 
 <form>
<input type=button value="Close Window" onClick="javascript:window.close();">
</form>

تقویم شمسی IE 6+, Opera 9+ |

<SCRIPT LANGUAGE="JAVASCRIPT">
function showdate() {
week= new Array("يكشنبه","دوشنبه","سه شنبه","چهارشنبه","پنجشنبه","جمعه","شنبه")
months = new Array("فروردين","ارديبهشت","خرداد","تير","مرداد","شهريور","مهر","آبان","آذر","دي","بهمن","اسفند");
a = new Date();
d= a.getDay();
day= a.getDate();
month = a.getMonth()+1;
year= a.getYear();
if (year== 0){year=2000;}
if (year<100){year +=1900;}
y=1;
for(i=0;i<3000;i+=4) {
if (year==i) {y=2;}
}
for(i=1;i<3000;i+=4) {
if (year==i) {y=3;}
}
if (y==1) {
year -= ( (month < 3) || ((month == 3) && (day < 21)) )? 622:621;

switch (month) {
case 1: (day<21)? (month=10, day+=10):(month=11, day-=20); break;
case 2: (day<20)? (month=11, day+=11):(month=12, day-=19); break;
case 3: (day<21)? (month=12, day+=9):(month=1, day-=20); break;
case 4: (day<21)? (month=1, day+=11):(month=2, day-=20); break;
case 5:
case 6: (day<22)? (month-=3, day+=10):(month-=2, day-=21); break;
case 7:
case 8:
case 9: (day<23)? (month-=3, day+=9):(month-=2, day-=22); break;
case 10:(day<23)? (month=7, day+=8):(month=8, day-=22); break;
case 11:
case 12:(day<22)? (month-=3, day+=9):(month-=2, day-=21); break;
default: break;
}
}
if (y==2) {
year -= ( (month < 3) || ((month == 3) && (day < 20)) )? 622:621;

switch (month) {
case 1: (day<21)? (month=10, day+=10):(month=11, day-=20); break;
case 2: (day<20)? (month=11, day+=11):(month=12, day-=19); break;
case 3: (day<20)? (month=12, day+=10):(month=1, day-=19); break;
case 4: (day<20)? (month=1, day+=12):(month=2, day-=19); break;
case 5: (day<21)? (month=2, day+=11):(month=3, day-=20); break;
case 6: (day<21)? (month=3, day+=11):(month=4, day-=20); break;
case 7: (day<22)? (month=4, day+=10):(month=5, day-=21); break;
case 8: (day<22)? (month=5, day+=10):(month=6, day-=21); break;
case 9: (day<22)? (month=6, day+=10):(month=7, day-=21); break;
case 10:(day<22)? (month=7, day+=9):(month=8, day-=21); break;
case 11:(day<21)? (month=8, day+=10):(month=9, day-=20); break;
case 12:(day<21)? (month=9, day+=10):(month=10, day-=20); break;
default: break;
}
}
if (y==3) {
year -= ( (month < 3) || ((month == 3) && (day < 21)) )? 622:621;

switch (month) {
case 1: (day<20)? (month=10, day+=11):(month=11, day-=19); break;
case 2: (day<19)? (month=11, day+=12):(month=12, day-=18); break;
case 3: (day<21)? (month=12, day+=10):(month=1, day-=20); break;
case 4: (day<21)? (month=1, day+=11):(month=2, day-=20); break;
case 5:
case 6: (day<22)? (month-=3, day+=10):(month-=2, day-=21); break;
case 7:
case 8:
case 9: (day<23)? (month-=3, day+=9):(month-=2, day-=22); break;
case 10:(day<23)? (month=7, day+=8):(month=8, day-=22); break;
case 11:
case 12:(day<22)? (month-=3, day+=9):(month-=2, day-=21); break;
default: break;
}
}
document.write(week[d]+" "+day+" "+months[month-1]+" "+ year);
}
</SCRIPT>

<FONT face=tahoma size="2" color="#000000">
<SCRIPT>showdate()</SCRIPT>
</FONT>

تعیین زمان برای بازدید از صفحه و رفتن به صفحه مورد نظر IE 6+ , FF 1+ , Opera 9+ |

<div align="center">
<form name="redirect">
<input type="text" size="2" name="redirect2" style="text-align:center; width:35px">
Seconds
</form></div>
<script>

</script>

تصویر تصادفی در صفحه با هر بار لود شدن صفحه IE 6+ , FF 2+ , Opera 9+ |

</SCRIPT>

همچنین به تگ body صفحه عبارت onload="RandomNumber()" را اضافه نمایید.

تقویم میلادی با فرمتهای مختلف IE 6+ |



<script language="javascript" type="text/javascript">

</script>



<head>
<script language="javascript" type="text/javascript">

</script>
</head>

<SCRIPT language=Javascript>

</script>

نمایش لود شدن صفحه تا بارگزاری کامل آن IE 6+, FF1+, Opera 9+ |

<head>
<script language="javascript" type="text/javascript">

</script>
</head> <body>
<div id="loading" style="position:absolute; z-index:4; width: 26%; visibility: visible; height: 60px; margin-top:100px; background-repeat:no-repeat; border: 1px dashed #777777; background-color: #FFFFdd; left: 36%;" >
<table width="100%" border="0" cellpadding="0" cellspacing="0">

<tr>
<td height="50" align="center" valign="middle"><img src="مسیر آیکن مورد نظر خود"></td>
</tr>
<tr>
<td height="20" align="center" valign="middle" style="direction:rtl"><span class="style110">لطفا" تا بارگزاری کامل صفحه صبر کنید.</span></td>
</tr>
</table>
</div></body>

همچنین به تگ body صفحه عبارت onload="change()" را اضافه نمایید.

نمایش پیغام با کلیک روی یک دکمه IE 6+, FF1+, Opera 9+ |

<form>
<input name="button" type="button" onClick="alert('**** YOUR MESSAGE ****'); return true" value="message">
</form>

حرکت دو خط همراه نشانگر ماوس IE 6+ |



<style>
<!--

#leftright, #topdown{
position: absolute;
left: 0;
top: 0;
width: 1px;
height: 1px;
layer-background-color: #aaaaaa;
background-color: #aaaaaa;
z-index: 100;
font-size: 1px;
}

-->
</style>


<div id="leftright" style="width:expression(document.body.clientWidth-2)"></div>
<div id="topdown" style="height:expression(document.body.clientHeight-2)"></div>

if (document.all&&!window.print){
leftright.style.width=document.body.clientWidth-2
topdown.style.height=document.body.clientHeight-2
}
else if (document.layers){
document.leftright.clip.width=window.innerWidth
document.leftright.clip.height=1
document.topdown.clip.width=1
document.topdown.clip.height=window.innerHeight
}
function followmouse1(){
//move cross engine for IE 4+
leftright.style.pixelTop=document.body.scrollTop+event.clientY+1
topdown.style.pixelTop=document.body.scrollTop
if (event.clientX<document.body.clientWidth-2)
topdown.style.pixelLeft=document.body.scrollLeft+event.clientX+1
else
topdown.style.pixelLeft=document.body.clientWidth-2
}

function followmouse2(e){
//move cross engine for NS 4+
document.leftright.top=e.y+1
document.topdown.top=pageYOffset
document.topdown.left=e.x+1
}

if (document.all)
document.onmousemove=followmouse1
else if (document.layers){
window.captureEvents(Event.MOUSEMOVE)
window.onmousemove=followmouse2
}

function regenerate(){
window.location.reload()
}
function regenerate2(){
setTimeout("window.onresize=regenerate",400)
}
if ((document.all&&!window.print)||document.layers)
//if the user is using IE 4 or NS 4, both NOT IE 5+
window.onload=regenerate2

//-->
</script>

متن مخفی که با کلیک روی لینک ظاهر می گردد. IE 6+, FF1+, Opera 9+ |

<head>
<SCRIPT language=javascript type=text/javascript>
function archives(Down)
{
current=(document.getElementById(Down).style.display == "none") ? "block" : "none";
document.getElementById(Down).style.display = current;
}
</SCRIPT>
</head>

<body>

<A onClick="archives('archives'); return false;" href="#">Click Here</a>
<DIV id=archives style="DISPLAY: none">*** Welcome to Our Website *** </DIV>

</body>

افکتی جهت نمایش پیغام و توضیحات در صفحه IE 6+, FF1+, Opera 9+ |

1- کد زیر را در قسمت head صفحه کپی نمایید

2- این بخش از کد را در قسمت body ، خارج از هر تگ دیگری کپی کنید.

3- کد زیر را در محل مورد نظر خود کپی نمایید

منویی متحرک در کنار صفحه که با رفتن ماوس روی آن باز میشود. IE 6+, FF1+, Opera 9+ |

body {
backgroud-color: #ffffff
}
</style>

دانلود فایل ضمیمه: js_SideMenu.zip

منوی متحرک در صفحه IE 6+, FF1+, Opera 9+ |

<table width="130" border="1" align="left" cellpadding="0" cellspacing="0" bordercolor="#999999" bgcolor="#CCCCCC">
<tr>
<td width="100%" bgcolor="#0066CC">
<p align="center" class="style1"><font size="4">Menu</font></p></td>
</tr>
<tr>
<td width="100%" align="center" bgcolor="#f5f5f5">
<p align="center"> <a href="http://www.dynamicdrive.com" target="_blank"><br>
webkaran</a><br>
----------<br>
<a href="http://www.yahoo.com/" target="_blank">yahoo!</a><br>
----------<br>
<a href="http://www.google.com/" target="_blank">Google</a><br>
----------<br>
<a href="http://www.ask.com/" target="_blank">Ask</a><br>
<br>

</p>

</td>
</tr>
</table>

</div>