الدرس التاسع عن كفيه عمل ازرر متحركه بطريقه احترافيه بتقنيه css

أيوب · 04-29-2010

درس مميز لتقنية الهوفر كما انه لو لم تستعمل صور كان افضل لان التقنية الجديدة من السي اس اس مطورة كتيرة وتغنيط عن الصور الى ما دلك

قناص جوبا · 04-30-2010

اها اكيد يا غالى
بس انا شرحت الطرق اللى بتعامل بيها
وكل واحد يختار اللى تريحه

● S M S M ● · 05-20-2010

ماشاء الله
من اقوى الدروس في عمل الازرار المتحركه
جزاك الله خير وبارك الله فيك
بس انا عندي استفسار
لو اجيت اطبق مثل الشرح بالضبط يطلع كل شي تمام
لكن حبيت اعمل قائمة افقيه فيها في ازرار وبتغيير مع كل رابط
وعمل تصميم للصورة الاولى
وهذه هيه الصورة الافقية

ومثلا فيها ازرار
الرئيسية - المدونة- المنتدى - المجلة - اتصل بنا
وردت اخلي الصورة الثانيه تكون بخاصيه hover على كل رابط بهذه الصورة الثانية

فكيف يكون ترتيب الاكواد

وجزاك الله خير و وفقك لعمل الخير

قناص جوبا · 05-21-2010

الموضوع بسيط جدا يا غالى
انت الاول بس اعمل القائمه وانسى ال hover دلوقتى
واعطينى الاكواد وهشرحلك عليها

● S M S M ● · 05-21-2010

كود الكلاسات

كود PHP:


			
 
<div class="smsm">
<a id="li" href="index.php" title=" الرئيسية"></a>
<a id="li1" href="index.php" title=" المجلة"></a>
<a id="li2" href="index.php" title=" الدردشة"></a>
<a id="li3" href="index.php" title=" المنتدى"></a>
<a id="li4" href="index.php" title=" اتصل بنا"></a>
</div>

كود الـ css

كود PHP:


			
 
.smsm{
background-image:url('11.gif');
width:567px;
height:43px;
background-repeat:no-repeat;
margin:auto;
position:relative; 
}
#li{
position:absolute;
height:43px;
width:113px;
right:0px;
}
#li:hover{
background-image:url('1hover.gif');
}
#li1{
position:absolute;
height:43px;
width:113px;
right:113px;
}
#li1:hover{
background-image:url('2hover.gif');
}
#li2{
position:absolute;
height:43px;
width:113px;
right:226px;
}
#li2:hover{
background-image:url('3hover.gif');
}
#li3{
position:absolute;
height:43px;
width:113px;
right:339px;
}
#li3:hover{
background-image:url('4hover.gif');
}
#li4{
position:absolute;
height:43px;
width:113px;
left:px;
}
#li4:hover{
background-image:url('5hover.gif');
}

الصور المستخدمة
صورة القائمة

صورة الازرار تأثير hover

الناتج

لكن الامر مرهق استخدام خمس صور
الكتابه على كل زر
هل استطيع عمل صورة واحده فقط واوزعها على كل اقسام الهوفر ؟
بدون ان اكتب على الصور
ولو اردت ان اكتب اسماء الرئيسية,المجلة,الدردشة,المنتدى داخل اكود الـ CSS
كيف سيصبح الكود
وجزاك الله خير

قناص جوبا · 05-21-2010

الهوفر يا غالى اهم حاجه توصل للفكره
اما هو سهل جدا
هناك اكثر من طريقه وانا شرحتها
مثلا عندك الطريقه التانيه فى الدرس ده دى تقدرر تكررها بدون الكتابه كل مره فى الفوتوشوب

el_kuch · 06-03-2010

السلام عليكم

الطريقة الثالثة مافهمتها
خصوصا

background-position:-15px -113px;

مافهمتش كيف عملت القيم دي

بس لو تفهمني على هذه الصورة ..اين احط نقظة الصفر و كيف احسب
الله يحفظك

قناص جوبا · 06-03-2010

معاك حق هى مع انها افضل واسرع طريقه الا انها صعبه شويه
انا عندى حل افضل يا غالى علشان تفهمها فيديو
الدرس الثانى من دوره توزيع الوجهات وضع روابط على التوزيع

el_kuch · 06-04-2010

شكرا جزيلا فهمت شوي ..القيم السالبة لسة مش ظابطهم

ان شالله احاول

قناص جوبا · 06-04-2010

هى المسئله عاوزه تكرار فقط وتجريب وان شاء الله تظبط معاك

أدوات الموضوع
مشاهدة صفحة طباعة الموضوع أرسل هذا الموضوع إلى صديق
انواع عرض الموضوع
العرض العادي الانتقال إلى العرض المتطور الانتقال إلى العرض الشجري

LinkBacks (?) LinkBack to this Thread: http://vbegy.info/vb/t906.html
أرسلت بواسطة	For	Type	التاريخ
Untitled document	This thread	Refback	02-09-2012 03:57 PM
Untitled document	Post #0	Refback	11-11-2011 04:37 PM
Untitled document	This thread	Refback	02-10-2011 05:46 PM
Untitled document	This thread	Pingback	06-27-2010 05:39 PM
Untitled document	This thread	Pingback	06-25-2010 08:13 PM
Untitled document	This thread	Refback	05-22-2010 06:15 PM
Untitled document	This thread	Refback	02-01-2010 05:05 PM
Untitled document	This thread	Refback	01-15-2010 12:04 AM
Untitled document	This thread	Refback	01-13-2010 07:28 PM
Untitled document	This thread	Trackback	01-12-2010 11:01 PM
Untitled document	This thread	Trackback	01-12-2010 10:52 PM

فى بى ايجى التطويرية
موقع تكويد	مركز رفع صور وملفات	مدونه فى بى ايجى	منتدى المشاكل	منتدى مجانى
معرض استايلات	دليل مواقع \| اضف موقعك	استضافه مجانيه	اعمال فى بى ايجى	دوره اداره الموقع
دوره تصميم الاستايلات	تبادل اعلانى	تبادل اعلانى	تبادل اعلانى	تبادل اعلانى

رسالة مدير الموقع

دورة تصميم قالب ورد بريس بلوحة تحكم

دورة برمجه اضافه اتصل بنا للورد بريس

الدرس التاسع عن كفيه عمل ازرر متحركه بطريقه احترافيه بتقنيه css

دورة تصميم استايلات vbulletin بال css

روابط vbegy

دورات vbegy

مواقع تابعه لـ vbegy

اتصل بنا

خدمات موقع تكويد