طريقة لتشغيل واطفاء المصباح الكهربائي باستخدام أكواد جافا سكريبت

الدرس الثاني :طريقة  لتشغيل واطفاء المصباح الكهربائي باستخدام أكواد جافا سكريبت .

طريقة العمل سهلة للغاية وهي ببساطة أننا نقوم باستدعاء صوره من أصل صورتين محفوظتين لدي (صورة اطفاء المصباح + صورة تشغيل المصباح ) وعند الضغط على زر تشغيل نقوم باستدعاء الصورة ذات الخلفية الصفراء في زجاج المصباح وكذلك عند الضغط على زر إطفاء يتم استدعاء صورة بدون خلفية ليتم اخفاء الصورة السابقة وعرض صورة ذات خلفية رمادية .

أقرأ أيضا :
ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
طريقة عمل زر لعرض التاريخ والوقت باستخدام جافا سكريبت
ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ

كود جافا سكريبت لتشغيل واطفاء المصباح: 

<center>
<button onclick="document.getElementById('myImage').src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiTYoN4_kVTfAcYnBF5shcXkUTgFgdbfYO14BWagPDjLW-yBEPYqhUwMxXvooaXFeRojpMwwtna1refukwGWkXxBsYUtKx-kUINZYUIJoUUK6W3riKNeYj6JyYnCHMnxyVTTwyU-Xm8t8/s1600/pic_bulbon.gif'">تشغيل</button>

<img id="myImage" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij5Lq9aBmxuMI1blZsYyhIVVhAC9BSv7EaHVhkhyphenhyphenY_fkulb-RAHDgG6i1KuC5MGdJO5ALnyw5XDsYw1_g7QUM8mdu_Xi7m_TN-MvfiUa9t7z4vXc_sDUDzdisLboZXy3BB8Zgy-mViDDw/s1600/pic_bulbon.gif" style="width: 100px;" />

<button onclick="document.getElementById('myImage').src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij5Lq9aBmxuMI1blZsYyhIVVhAC9BSv7EaHVhkhyphenhyphenY_fkulb-RAHDgG6i1KuC5MGdJO5ALnyw5XDsYw1_g7QUM8mdu_Xi7m_TN-MvfiUa9t7z4vXc_sDUDzdisLboZXy3BB8Zgy-mViDDw/s1600/pic_bulboff.gif'">إطفاء</button>

</center>

* يمكن تغيير الصورة بالصور التي ترغب في اضافتها وتغيير مصدر الصور في src="" واضافة المزيد من المرح الى صفحات موقعك والعابك .