IDN » ایجاد rolloverهای کاراتر

( تعداد نمایش : 1588 )

ایجاد rolloverهای کاراتر

به منظور ایجاد یک تصویر متحرک در هنگام قراردادن ماوس برروی تصویر, بایستی در نمایش تصویر دوم تاخیری ایجاد نشود. بدین منظور با استفاده از JavaScript تمامی تصاویر را از قبل به سیستم کاربر انتقال داده تا در زمان لزوم, تصاویر توسط متغییر بوسیله اسکریپت نشان داده شوند.
برای تهیه rollover بهتر
if (document.images) { arrowRed = new Image arrowBlue = new Image arrowRed.src = “images/test1.gif” arrowBlue.src = “images/test2.gif” }	1.
توسط این کدها, قابلیت درک اشیاء توسط browser امتحان گشته, در صوریتکه جواب مثبت شد, دو تصویر مجزای arrowRed و arrowBlue ایجاد میگردند. سپس از ویژگی src در تعیین مکان تصویر استفاده میشود.
else { arrowRed = “” arrowBlue = “” document.arrow = “” }	2.
برای browserهای قدیمی, به منظور جلوگیری از نمایش پیغامهای اشتباه, بهتر است از حالت else با متغیرها و document.arrow که خالی هستند, یک رشته حرفی خالی درست کنید.
<A href=”aghta.com” onMuseover = “document.arrow.src = arrowRed.src” onMouseout = “document.arrow.src = arrowBlue.src”>	3.
دستورات آدرس دهی فوق, برای ایجاد پیوند با توجه به مشخصات, rollover موجود در صفحه نوشته میشود, یعنی دو کنترل کننده onMouseover و onMouseout را درون تگ آدرس قرار داده تا دو حالت ممکن را تعریف کنند.
**نکات مورد توجه
یادآوری میشود که در هنگام ایجاد تصویر gif از تصاویر شفاف استفاده نکنید زیرا در هنگام تعویض تصویر دوم, تصویر قبل در زیر آن نمایش داده میشود. توجه داشته باشید که ابعاد هر دو تصویر بایستی یکسان باشند. هرچند در IE تصاویر غیر اندازه بطور مناسب نمایش داده میشوند, اما در netscape متیجه مطلوبی نخواهد داشت. <html> <head> <script language=”javascript” type=”text/javascript”> if(document.images) { arrowRed = new Image arrowBlue = new Image arrowRed.src = “images/test1.gif” arrowBlue.src = “images/test2.gif” } else { arrowRed = “” arrowBlue = “” document.arrow = “” } </script> </head> <body> <h1> <a href=”http://aghta.com” onMouseover=”document.arrow.src=arrowRed.src” onMouseout=”document.arrow.src=arrowBlue.src”><img border=”0″ src=”images/test2.gif” name=”arrow”></a> </h1> </body> </html>

دیدگاه خود را بیان کنید.

باید وارد سایت شده باشید برای دیدگاه دادن

اطلاعات