 |
بسم الله الرحمن الرحيم
اريد عمل شئ استطيع من خلاله تغير كلام معين عند الوقوف على صورة معينه بمعني انه لدى مثلا جدول يوجد بيه ثلاث صور فى الشمال وفى يمين الجدول مكان فارغ اريد عند الوقوف على اى صورة من الصور الموجوده فى الشمال يتم تغير هذا الكلام دون اعادة تحميل الصفحة , هذه الطريقة اظن انها باستخدام الجافا او باستخدام الفلاش ارجو ان يتكرم احد ويشرح احد هذه الطرق , ويوجد مثال للتوضيح فى المرفقات ,, فى انتظار الشرح .....
لقد قمت بعمل الصفحة التالية كمثال:
http://www.phpaw.com/javascript/javascript-02.htm
المصدر:
الشفرة المطلوبة أساسًا:كود HTML:<html dir="rtl"> <head> <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <title>JavaScript Folder- TEST:02</title> <script language="javascript" type="text/javascript"> function changedes(divid, des) { document.getElementById(divid).innerHTML='<p align="center">'+des+'</p>'; } </script> </head> <body> <div style="align: center; position: absolute; width: 380px; height: 35px; z-index: 1; right: 10px; top: 15px" id="des"> <p align="center"> </div> <p align="center"> <span lang="ar-om"> </span> </p> <div style="position: absolute; width: 487px; height: 100px; z-index: 2; right: 581px; top: 27px" id="layer1"> <span lang="ar-om"> <img border="0" src="http://www.swalif.net/adserver/adimage.php?filename=swalifmakers.gif&contenttype=gif" onmouseover="changedes('des', 'شكرًا سوالف');" onmouseout="changedes('des', '');" width="321" height="94" align="left"></span><img border="0" src="https://addons.mozilla.org/img/app-icons/firefox.png" onmouseover="changedes('des', 'Mozilla Firefox');" onmouseout="changedes('des', '');" width="64" height="64"></div> </body> </html>
الإستخدام:كود:<script language="javascript" type="text/javascript"> function changedes(divid, des) { document.getElementById(divid).innerHTML='<p align="center">'+des+'</p>'; } </script>
ضع الآتي في وسم عرض الصورة:
مثال:كود:onmouseover="changedes('مكان عرض الوصف', 'الوصف');" onmouseout="changedes('مكان عرض الوصف', '');"
كود HTML:<img border="0" src="image.jpg" onmouseover="changedes('divid', 'صورة');" onmouseout="changedes('divid', '');"> <!-- عرض الوصف --> <div id="divid"></div>
__________________
مدونتي .. دروس (PHP, JavaScript, C, Java)
برمجة وتطوير المواقع والمنتديات
الحركة هذي لها طريقتين الأولى بـ CSS والثانية بـكود سكربت بسيط
الـCSS تحتاج لها خبرة لكن الكود سكربت بسيط وتعديل فقط
والطريقة هنا بالروابط وأنت ممكن تستخدمها للصور
http://www.dynamicdrive.com/dynamicindex5/linkinfo.htm
وممكن تحصل درس CSS في الموقع
__________________
” كذب من قال الدنيا هي نفسها الدنيا بعيني من بعدك ياأبو محمد “
﴿ كُلُّ نَفْسٍ ذَآئِقَةُ الْمَوْتِ ... ﴾ رحمة الله عليك
*عدم ردي على بعض الرسائل لايعني تجاهلي لها
ضوابط المشاركة
رد مع اقتباس