السلام عليكم ورحمة الله وبركاته
اخباركم ان شاءالله بخير
حبيت اسوي درس شرح عمل الازرار المتحركه بعدمرورالماوس / درسنا سهل جدآ
وهذا طلب الجميع لهذا الدرس عشان هيك سويته
تقدرون تغيرون صيغة جودة الفيديوا الى 720 هي واضحه جدآ
واتمنى من الجميع الاستفاده من الموضوع وعمل ريبلوق للكل عشان اي شخص موفاهم يفهم
نجي للموضوع ي احبائي
طبعآ سويت لكم الشرح فيديوووو يعني عملي
ونفس الوقت نظري عشان اذا حبيتم تشوفون كيف الطريقه من قرب
وهذا النظري وان شاءالله تستفيديوا ..
وهذا درسنا نظري وان شاءالله تستفيدوا
وطبعآ هذه هديتي لكم وهي الازرار
هنااا تحميل الازرار ( )
هنا الاكواد العمل نجي الى اكواد الـ CSS
<pre><code><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title> شرح الازرار المتحركه بعد مرورالماوس </title> <style type="text/css"> .h-tmdd { background-image:url('صورة الخلفيه'); background-repeat:repeat-x; height:500px; } .h1 { background-image:url('صورة الوسط');; background-repeat:no-repeat; height:500px; width:900px; margin-right:auto; margin-left:auto; position:relative; } .a { background-image:url('قبل مرورالماوس'); background-repeat:no-repeat; height:43px; width:116px; position:relative; float:right; top:231px; right:174px; } .a:hover { background-image:url('بعدمرورالماوس'); background-repeat:no-repeat; height:43px; width:116px; position:relative; float:right; top:231px; right:174px; } .b { background-image:url('قبل مرورالماوس'); background-repeat:no-repeat; height:43px; width:115px; position:relative; float:right; top:231px; right:176px; } .b:hover { background-image:url('بعدمرورالماوس'); background-repeat:no-repeat;; height:43px; width:115px; position:relative; float:right; top:231px; right:176px; } .c { background-image:url('قبل مرورالماوس'); background-repeat:no-repeat; height:43px; width:115px; position:relative; float:right; top:231px; right:178px; } .c:hover { background-image:url('بعدمرورالماوس'); background-repeat:no-repeat; height:43px; width:115px; position:relative; float:right; top:231px; right:178px; } .d { background-image:url('قبل مرورالماوس'); background-repeat:no-repeat; height:43px; width:115px; position:relative; float:right; top:231px; right:180px; } .d:hover { background-image:url('بعدمرورالماوس'); background-repeat:no-repeat; height:43px; width:115px; position:relative; float:right; top:231px; right:180px; } .f { position:absolute; height:43px; width:116px; right:640px; bottom:230px; } </style> </code></pre>
<pre><code><!-- header --> <div class="h-tmdd"> <div class="h1"> <a class="a" href="الرابط" title="الوصف"></a> <a class="b" href="الرابط" title="الوصف"></a> <a class="c" href="الرابط" title="الوصف"></a> <a class="d" href="الرابط" title="الوصف"></a> <a class="f" href="الرابط" title="الوصف"></a> </div> </div> <!-- header --> </code></pre>
وبالتوفيق للجميع واي سؤال انا حاضره لكم ..
وانتظروني ب الدرس الجاي وتحريك الازرار بطريقه اخرى ان شاءالله .
