microsoft
کاربر فعال
امروز بعد از مدتها تحلیل و بررسی مسائل مختلف و دانلودهای عجیب و غریب ، میخوام برم سراغ آموزش. آموزش برنامه نویسی جاوا اسکریپت.
برای شروع ابتدا باید توجه داشته باشید که از پیش فرضهای این آموزش ها ، این است که شما برنامه نویسی چهارچوبی وب یعنی HTML رو بلدید و مشکل چندانی در اون ندارید. البته من ضمن بحث های جاوا اسکریپت سعی میکنم در قسمتهایی که لازم هستند، کمی هم از HTML بحث کنیم. این آموزشها تا آنجا پیش میروند که شما رو در اینترنت صاحب یک سایت خوب حتی با امکانات ثبت نام کاربران نماید.پس اگر خواهان دارا شدن یک سایت ویژه خودتان و به اسم خودتان هستید که به دیگرون نشون بدید و فیسشو ببرید !!!! خوب تمرین کنید تا معنی آموزشها و نکات ترفندی رو در برنامه نویسی خوب درک کنید.
شروع میکنیم.
ابتدا یک فایل HTML سریع بسازید.منظور از سریع ساختن اینه که یه جای خالی از دسکتاپ مثلا ، کلیک راست کنید و NEW و سپس TEXT DOCUMENT رو انتخاب کنید .سپس یک نام با پسوند HTML یا HTM به آن بدهید. این از این
حالا بر روی اون کلیک راست بزنید و از گزینه OPEN WITH گزینه NOTEPAD رو انتخاب کنید تا بریم سراغ برنامه نویسی.
حالا میریم سراغ طرح مسئله و حل قدم به قدم اون.
سوال : صفحه ای طراحی کنید که یک عکس رو نمایش بده. وقتی ماوس رو بر روی اون عکس بردیم به عکسی دیگه عوض بشه و وقتی ماوس رو از روی اون کنار بردیم دوباره به عکس اول برگرده.
خوب میریم سراغ نوشتن کد.
ابتدا یک عکس انتخابی خودتان از روی هارد دیسکتان رو در اونجایی که این فایل HTML رو ساختید کپی کنید یعنی در دسکتاپ . و نا م اون عکس رو بزارید 1 و با پسوند JPG
در همان پنجره NOTEPAD این کد را جهت نمایش یک عکس تایپ کنید.
< IMG SRC=1.JPG>
وقتی این کد رو اجرا میکنید عکس 1 به شما نمایش داده میشود.خوب تا اینجا شد مقدمات و آمادگی ها در HTML.
کد این برنامه رو در لینک زیر گذاشتم. دانلود کنید تا خط به خط توضیح بدم.
http://megarapid.persiangig.com/ZIPFILES/mouse events.zip
حالا فایل mouse events with id.htm را با روشی که بهتون گفتم در NOTE PAD باز کنید.یعنی روش کلیک راست و OPEN WITH و سپس NOTEPAD
حالا به سطر 13 در این متن برید. چطوری؟ ترکیب کلیدهای CTRL+G رو بزنید و شماره 13 رو تایپ کنید.با این کار مکان نمای شما به سطر 13 متن موجود برده میشود.
در این سطر میبینید که به سادگی یک تگ نمایش عکس تعریف شده.که در ابتدا با پارامتر ID نامگذاری شده و عکسی به نام 2 رو فراخوانی کرده. و با دو رویداد یا همون EVENT تحت کنترل در اومده. در این کنترلها گفته شده که اگر ماوس رو بر روی عکس آوردم تابعی جاوایی به نام a رو اجرا کن و اگر ماوس رو از روی عکس به کنار بردم تابعی دیگر رو به نام b اجرا کن. میریم سراغ نوشتن این توابع.
ابتدا در تگ SCRIPT که به طور پیش فرض کدهای جاوا اسکریپت رو پشتیبانی میکنه تابعی با نام a رو مینویسیم به این صورت که مقدار SRC رو در محلی از صفحه که با نام H نامگذاری شده رو به 1 با پسوند JPG تغییر بده. چرا این دستور رو نوشتیم؟ چون همونطور که شما در تگ IMG میبینید ابتدا عکس 2 جهت نمایش گذاشته شده و در ادامه رویدادی رو تعریف کردیم به اسم ONMOUSEOVER که وظیفه انجام کارهایی رو در زمانی که ماوس بر روی عکسمون قرار میکیره ، رو به عهده داره. به عبارتی دیگر هر گاه جناب مگسک ماوس تشریف بیاورند بر روی عکس شریف ما ، اونوقت ONMOUSEOVER کار خودش رو انجام میده که در اینجا اجرای تابعی به نام a میباشد.
و تابع b هم به همین صورت بخاطر کنار رفتن ماوس از روی عکس تعریف میشود که میدانید هر گاه ماوس ار روی هر چیزی کنار برود ، عمل ONMOUSEOUT انجام میگردد و تابعی که در جلوی این رویداد نوشته شده باشد ، به اجرا در می آید.
حالا این کار انجام شد. ببینیم در سطر 13 یعنی در تگ نمایش عکس اگر بجای ID از NAME استفاده کنیم ، چه تفاوتهایی خواهد داشت؟
فایل mouse events with document.htm رو با NOTEPAD باز کنید.
ببینید که در سطر 13 به جای ID از عبارت NAME استفاده شده. بنابر این در توابع بالا هم قبل از نام H از عبارت DOCUMENT استفاده شده است. این تنها تفاوت میباشد. مابقی قسمتها به همان صورت هستند. این که وقتی با ID میتوان برنامه ای ساده تر نوشت پس چه دلیلی وجود داره که بیایم کارمون رو زیادتر کنیم و از NAME استفاده کنیم که باعث بوجود آمدن DOCUMENT در کد جاوا شود ، رو در بحثهای بعدی توضیح خواهم داد.
دقت داشته باشید که فعلا تمامی فایلهای وبی که از من میگیرید رو فقط با INTERNET EXPLORER باز کنید نه با FIRE FOX یا OPERA و ...
سلامت باشید دوستان من
برای شروع ابتدا باید توجه داشته باشید که از پیش فرضهای این آموزش ها ، این است که شما برنامه نویسی چهارچوبی وب یعنی HTML رو بلدید و مشکل چندانی در اون ندارید. البته من ضمن بحث های جاوا اسکریپت سعی میکنم در قسمتهایی که لازم هستند، کمی هم از HTML بحث کنیم. این آموزشها تا آنجا پیش میروند که شما رو در اینترنت صاحب یک سایت خوب حتی با امکانات ثبت نام کاربران نماید.پس اگر خواهان دارا شدن یک سایت ویژه خودتان و به اسم خودتان هستید که به دیگرون نشون بدید و فیسشو ببرید !!!! خوب تمرین کنید تا معنی آموزشها و نکات ترفندی رو در برنامه نویسی خوب درک کنید.
شروع میکنیم.
ابتدا یک فایل HTML سریع بسازید.منظور از سریع ساختن اینه که یه جای خالی از دسکتاپ مثلا ، کلیک راست کنید و NEW و سپس TEXT DOCUMENT رو انتخاب کنید .سپس یک نام با پسوند HTML یا HTM به آن بدهید. این از این
حالا بر روی اون کلیک راست بزنید و از گزینه OPEN WITH گزینه NOTEPAD رو انتخاب کنید تا بریم سراغ برنامه نویسی.
حالا میریم سراغ طرح مسئله و حل قدم به قدم اون.
سوال : صفحه ای طراحی کنید که یک عکس رو نمایش بده. وقتی ماوس رو بر روی اون عکس بردیم به عکسی دیگه عوض بشه و وقتی ماوس رو از روی اون کنار بردیم دوباره به عکس اول برگرده.
خوب میریم سراغ نوشتن کد.
ابتدا یک عکس انتخابی خودتان از روی هارد دیسکتان رو در اونجایی که این فایل HTML رو ساختید کپی کنید یعنی در دسکتاپ . و نا م اون عکس رو بزارید 1 و با پسوند JPG
در همان پنجره NOTEPAD این کد را جهت نمایش یک عکس تایپ کنید.
< IMG SRC=1.JPG>
وقتی این کد رو اجرا میکنید عکس 1 به شما نمایش داده میشود.خوب تا اینجا شد مقدمات و آمادگی ها در HTML.
کد این برنامه رو در لینک زیر گذاشتم. دانلود کنید تا خط به خط توضیح بدم.
http://megarapid.persiangig.com/ZIPFILES/mouse events.zip
حالا فایل mouse events with id.htm را با روشی که بهتون گفتم در NOTE PAD باز کنید.یعنی روش کلیک راست و OPEN WITH و سپس NOTEPAD
حالا به سطر 13 در این متن برید. چطوری؟ ترکیب کلیدهای CTRL+G رو بزنید و شماره 13 رو تایپ کنید.با این کار مکان نمای شما به سطر 13 متن موجود برده میشود.
در این سطر میبینید که به سادگی یک تگ نمایش عکس تعریف شده.که در ابتدا با پارامتر ID نامگذاری شده و عکسی به نام 2 رو فراخوانی کرده. و با دو رویداد یا همون EVENT تحت کنترل در اومده. در این کنترلها گفته شده که اگر ماوس رو بر روی عکس آوردم تابعی جاوایی به نام a رو اجرا کن و اگر ماوس رو از روی عکس به کنار بردم تابعی دیگر رو به نام b اجرا کن. میریم سراغ نوشتن این توابع.
ابتدا در تگ SCRIPT که به طور پیش فرض کدهای جاوا اسکریپت رو پشتیبانی میکنه تابعی با نام a رو مینویسیم به این صورت که مقدار SRC رو در محلی از صفحه که با نام H نامگذاری شده رو به 1 با پسوند JPG تغییر بده. چرا این دستور رو نوشتیم؟ چون همونطور که شما در تگ IMG میبینید ابتدا عکس 2 جهت نمایش گذاشته شده و در ادامه رویدادی رو تعریف کردیم به اسم ONMOUSEOVER که وظیفه انجام کارهایی رو در زمانی که ماوس بر روی عکسمون قرار میکیره ، رو به عهده داره. به عبارتی دیگر هر گاه جناب مگسک ماوس تشریف بیاورند بر روی عکس شریف ما ، اونوقت ONMOUSEOVER کار خودش رو انجام میده که در اینجا اجرای تابعی به نام a میباشد.
و تابع b هم به همین صورت بخاطر کنار رفتن ماوس از روی عکس تعریف میشود که میدانید هر گاه ماوس ار روی هر چیزی کنار برود ، عمل ONMOUSEOUT انجام میگردد و تابعی که در جلوی این رویداد نوشته شده باشد ، به اجرا در می آید.
حالا این کار انجام شد. ببینیم در سطر 13 یعنی در تگ نمایش عکس اگر بجای ID از NAME استفاده کنیم ، چه تفاوتهایی خواهد داشت؟
فایل mouse events with document.htm رو با NOTEPAD باز کنید.
ببینید که در سطر 13 به جای ID از عبارت NAME استفاده شده. بنابر این در توابع بالا هم قبل از نام H از عبارت DOCUMENT استفاده شده است. این تنها تفاوت میباشد. مابقی قسمتها به همان صورت هستند. این که وقتی با ID میتوان برنامه ای ساده تر نوشت پس چه دلیلی وجود داره که بیایم کارمون رو زیادتر کنیم و از NAME استفاده کنیم که باعث بوجود آمدن DOCUMENT در کد جاوا شود ، رو در بحثهای بعدی توضیح خواهم داد.
دقت داشته باشید که فعلا تمامی فایلهای وبی که از من میگیرید رو فقط با INTERNET EXPLORER باز کنید نه با FIRE FOX یا OPERA و ...
سلامت باشید دوستان من
