طراحی سایت

بخش چهارم Event attribute در html

در سلسله آموزشهای طراحی سایت آنلاینر به بخش سوم Event attribute در html پرداختیم.

در این مقاله قصد بررسی بخش چهارم Event attribute در html را داریم.

رویداد های موس Mouse Events

onclick : این رویداد زمانی اجرا میشود که روی عامل مورد نظر کلیک شود.
ondblclick :این رویداد زمانی اجرا میشود که روی عامل مورد نظر دابل کلیک شود.
ondrag :این رویداد زمانی اجرا میشود که عامل مورد نظر درگ شود.
ondragend :این رویداد در پایان عملیات درگ اجرا میشود.
ondragenter :این رویداد زمانی اجرا میشود که عامل مورد نظر در مقصد معتبری درگ شود.
ondragleave :این رویداد زمانی اجرا میشود که عامل مورد نظر توسط درگ از مکان معتبر خود خارج شود.
ondragover :این رویداد زمانی اجرا میشود که عامل درگ شده وارد منطقه معتبر شود.
ondragstart :این رویداد زمانی اجرا میشود که عملیات درگ شروع شود.
ondrop :این رویداد زمانی اجرا میشود که عامل درگ شده رها شود.
onmousedown :این رویداد زمانی اجرا میشود که یکی از دکمه های موس پایین فشرده شود.
onmousemove :این رویداد زمانی اجرا میشود که موس حرکت داده شود.
onmouseout :این رویداد زمانی اجرا میشود که اشاره گر موس از محدوده عامل مورد نظر خارج شود.
onmouseover :این رویداد زمانی اجرا میشود که اشاره گر موس وارد محدوده عامل مورد نظر شود.
onmouseup :این رویداد زمانی اجرا میشود که یکی از دکمه های موس رها شود.
onmousewheel :این رویداد زمانی اجرا میشود که دکمه چرخشی موس چرخش داده شود.
onscroll :این رویداد زمانی اجرا میشود که در نوار اسکرول عامل مورد نظر اسکرول شود.

رویداد های موس در صفحات وب از اهمیت خاصی برخوردارند به نحوی که هم در کارایی صفحه وب و هم در جذابیت و رفاه کاربر تاثیر بسزایی دارد.

مثال زیر کاربرد رویدادهای onmouseup و onmousedown را به خوبی بیان میکند.

[html]
<!DOCTYPE html>
<html>
<head>
<script>
function mouseDown()
{
document.getElementById("p1").style.color="red";
}

function mouseUp()
{
document.getElementById("p1").style.color="green";
}
</script>
</head>
<body>

</body>
</html>
[/html]

در مثال بالا هنگامی که روی پاراگراف کلیک کنید تابع mouseDown() رنگ متن را قرمز و با رها کردن کلید موس تابع onmouseup اجرا میشود . این تابع نیز رنگ متن را به سبز تغییر میدهد.

در آموزش بعد به embed کردن : video – sound – flash میپردازیم.

با آنلاینر همراه شوید …