دورة الجيكويري - الدرس 4 - show & hide

السلام عليكم ورحمة الله وبركاته


اليوم إن شاء الله تعالى سنتعرف على التأثيرين .show() & .hide()
سنستخدم نفس المثال السابق مع تغيير طفيف :
لنشرح ما قمنا به الآن من خطوات
أولا قمنا بعمل ملف استايل داخل الوثيقة وهو كالتالي :
ولن اشرح ملف الإستايل لأنه من المفروض أنكم تملكون معرفة مسبقة
ثم أننا قمنا بإرفاق ملف سكربت جيكويري وهو :

لنقم بتحليل الكود بالتفصيل الممل ..
أولا قمنا بعمل تحديد أو اختيار للعنصر الذي نريد تطبيق أوامر السكربت عليه وفي حالتنا هنا اخترنا input
ثم حددنا دالة للمحدد وهي دالة عند الضغط على input  قم بإظهار الفقرة p التي تم تحديدها مسبقا في المحدد
في ظرف ثانية واحدة حيث 1000  جزء من المائة يساوي ثانية بمعنى آخر
1000ms = 1s
اضن انه لحد الآن كل شيء واضح إذا لنجرب السكربت ثم نعود ..
انتهينا من الخطوة الأولى وهي إظهار كود مخفي أو حدث معين
الآن لنقل أننا نريد إخفاء الفقرة p ما الذي سنفعله يا ترى ؟؟!!
لا عليكم هذا ما سنعرفه الآن إن شاء الله تعالى بالأمر  .hide()
سنستعمل نفس السكربت السابق مع تعديل بسيط في ملف الإستايل وهو حذف السطر


display: none;


من الوسم p اضن الأمر سهل لحد الآن
الآن لاحظ معي السكربت كيف سيصبح شكله


لنقم بتحليل الكود بالتفصيل الممل ..
أولا قمنا بعمل تحديد أو اختيار للعنصر الذي نريد تطبيق أوامر السكربت عليه وفي حالتنا هنا اخترنا input
ثم حددنا دالة للمحدد وهي دالة عند الضغط على input  قم بإخفاء الفقرة p التي تم تحديدها مسبقا في المحدد
في ظرف ثانية واحدة
قم بتجربة الكود .. نتيجة رائعة أليس كذلك ..
انتهى درس اليوم إخواني أخواتي لا تنسوا إن تطبقوا ما تعلمتموه في هذا الدرس وأيضا الدروس السابقة
محبكم محمد طه







اضغط على السمايل للحصول على الكود: :) =( :s :D :-D ^:D ^o^ 7:( :Q :p T_T @@, :-a :W *fck* x@

TOP