آموزش جاوا اسكريپت

مات ( تاریک ) کردن یک تصویر
این اسکریپت برای این می باشد که شما می توانید با استفاده از آن تصاویر ( عکس های ) موجود در سایت ( و یا وبلاگ ) خودتان را به صورت مات ( تاریک ) قرار دهید ، سپس هرگاه که اشاره گر ( موس ) بر روی آن قرار گیرد ، تصویر واضح می شود .
این اسکریپت قابل اجرا در مرورگرهای زیر می باشد :
1- Fire fox = همه ورژن ها
2- Mozilla = ورژن های 1 به بالا
3- Intenet Explorer = ورژن های 5 به بالا
4- Netscape Navigator = غیر قابل استفاده

طرز کار و بررسی اسکریپت :
شما ابتدا کدهای که در زیر آمده را در بین دو تگ <Head> و <Head/> قرار می دهید :

<script language="JavaScript1.2">
/* [ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ] */
var opacite = 40;//tanzime Mati tasvir adade momken az 0 ta 100
function incOpa(element){
objet = element;
intervalle = setInterval("progressifChange(objet,100,true)",50) ;
}
function decOpa(element){
objet = element;
intervalle = setInterval("progressifChange(objet,opacite,false) ",50);
}
function progressifChange(image,maxOpa,sens){
if(sens){
// Afzayesh Mati Tasvir
if (image.filters.alpha.opacity<maxOpa)
image.filters.alpha.opacity+=5;
else if (window.intervalle)
clearInterval(intervalle);
}else{
// Kaheshe Mati Tasvir
if (image.filters.alpha.opacity>maxOpa)
image.filters.alpha.opacity-=5;
else if (window.intervalle)
clearInterval(intervalle);
}
}
</script>
شما می توانید مقدار مات ( تاریک ) بودن تصویر را با تغییر دادن عدد که در جلوی کد :
var opacite = 40
قرار دارد را ، کم و یا زیاد کنید . برای مثال ما در اینجا مقدار را 40 در نظر گرفته ایم .
در ضمن اعداد انتخابی شما می توانند بین 0 تا 100 باشند .
نکته : 0 به معنی این می باشد که تصویر خیلی مات باشد و همینطور که رقم بالا می رود از ماتی آن کاسته می شود .
با تغییر عدد کدی که در پایین آمده ، می توانید مقدار روشنایی ( به عبارتی دیگر ، درجه روشنایی ) تصویر هنگامی که اشاره گر ( موس ) بر روی تصویر قرار می گیرد را افزایش دهید .
image.filters.alpha.opacity+=5;
ما در اینجا برای مثال از عدد 5 استقاده کرده ایم .( اعداد قابل استقاده از 0 تا 100 )
با تغییر عدد کدی که در پایین آمده ، می توانید مقدار روشنایی ( به عبارتی دیگر ، درجه روشنایی ) تصویر هنگامی که اشاره گر ( موس ) بر روی تصویر قرار می گیرد را کاهش دهید .
image.filters.alpha.opacity-=5;
سپس کد زیر را باید در بین دو تگ <BODY> و <BODY/> قرار دهید .
نکته : دو تگ <CENTER> و <CENTER/> برای این می باشد که عکس در وسط قرار گیرد شما می توانید با استفاده از تگ های RIGHT و LEFT محل عکس را به ترتیب راست ، و چپ قرار دهید .
نکته : ما در اینجا برای مثال از [ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ] به عنوان تصویر استفاده کرده ایم ، شما آدرس عکسی که آپلود کرده اید را قرار می دهید .

<center>
<a href="http://www.zanjandata.com/" target="_blank">
<img src="http://www.zanjandata.com/honary/alogo.gif" border=0 style="filter:alpha(opacity=40);" onMouseover="incOpa(this)" onMouseout="decOpa(this)">
</a>
</center>

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>zanjandata</title>
<script language="JavaScript1.2">
/* [ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ] */
var opacite = 40;//tanzime Mati tasvir adade momken az 0 ta 100
function incOpa(element){
objet = element;
intervalle = setInterval("progressifChange(objet,100,true)",50) ;
}
function decOpa(element){
objet = element;
intervalle = setInterval("progressifChange(objet,opacite,false) ",50);
}
function progressifChange(image,maxOpa,sens){
if(sens){
// Afzayesh Mati Tasvir
if (image.filters.alpha.opacity<maxOpa)
image.filters.alpha.opacity+=5;
else if (window.intervalle)
clearInterval(intervalle);
}else{
// Kaheshe Mati Tasvir
if (image.filters.alpha.opacity>maxOpa)
image.filters.alpha.opacity-=5;
else if (window.intervalle)
clearInterval(intervalle);
}
}
</script>
</head>
<body>
<center>
<a href="http://www.zanjandata.com/" target="_blank">
<img src="http://www.zanjandata.com/honary/alogo.gif" border=0 style="filter:alpha(opacity=40);" onMouseover="incOpa(this)" onMouseout="decOpa(this)">
</a>
</center>
</body>
</html>
نکته : زمانی که بر روی تصویر کلیک شود به صفحه ای که در کد قرار دادید ، وارد می شوید . ما برای مثال ، سایت [ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ] را قرار داده ایم . ( یعنی بعد از کلیک بر روی عکس ، وارد سایت می شوید. )