منتديات جواهر ستار التعليمية
أهلا وسهلا بك زائرنا الكريم ، في منتديات جواهر ستار التعليميه
المرجو منك أن تقوم بتسجـيل الدخول لتقوم بالمشاركة معنا. إن لم يكن لـديك حساب بعـد ، نتشرف بدعوتك لإنشائه بالتسجيل لديـنا . سنكون سعـداء جدا بانضمامك الي اسرة المنتدى

مع تحيات الإدارة

نسيت كلمة السر !!

نموذج إعلان

pic

نموذج إعلان

pic

نموذج إعلان

pic


آخر المواضيع
الموضوع
تاريخ إرسال المشاركة
بواسطة
القرأن الكريم ولهجات العرب
نمذجة الإبداع المبكر
أسعد نفسك وأسعد الآخرين
ما هو نموذج GROW ؟
القدس معالم و تاريخ
عباس : أحمد مطر
بالأسماء لا بالأرقام
وفي ظلام الليل...!
صرة الفقراء شعر : مظفر النواب
اختبار الفصل الثالث في التربية الإسلامية للسنة الأولى ابتدائي
تمارين في جميع المواد التانية ابتدائي
نماذج لاختبارات الرياضيات سنة ثانية متوسط
الجمعة 27 أبريل - 20:18:23
الجمعة 27 أبريل - 20:18:01
الجمعة 27 أبريل - 20:17:44
الجمعة 27 أبريل - 20:17:22
الجمعة 27 أبريل - 20:16:40
الجمعة 27 أبريل - 20:16:07
الجمعة 27 أبريل - 20:15:52
الجمعة 27 أبريل - 20:15:36
الجمعة 27 أبريل - 20:15:22
الجمعة 27 أبريل - 20:14:12
الجمعة 27 أبريل - 20:13:25
الخميس 26 أبريل - 15:05:40
بشري
بشري
بشري
بشري
بشري
بشري
بشري
بشري
بشري
بشري
بشري
farida
الاعضاء فقط من يستطيع النسخ بعد مشركات
0

منتديات جواهر ستار التعليمية :: الاكواد و التقنيات || Codes and techniques

شاطر

الثلاثاء 16 سبتمبر - 13:44:59
المشاركة رقم:
Admin
Admin

avatar

إحصائيةالعضو

عدد المساهمات : 17922
تاريخ التسجيل : 16/06/2009
http://www.berberjawahir.com/
مُساهمةموضوع: كود القائمة فى الاقسام بخلفيه متحركه--css


كود القائمة فى الاقسام بخلفيه متحركه--css


/* ----------------------------- كود القائمة فى الاقسام بخلفيه متحركه----------------------------- */


ul{
margin:0;
padding:0;
}

li{
display:inline;
list-type:none;
}

a.glidebutton{
display: inline-block;
position: relative;
color: #4A4A4A; /* default color */
background: #ececec; /* default bg color */
text-decoration: none;
font: bold 14px Arial; /* font settings */
letter-spacing: 2px; /* font settings */
overflow: hidden;
height: 30px; /* height of each button */
text-align: center;
border-radius: 5px; /* border radius */
-moz-transition: all 0.3s ease-in-out; /* Enable CSS transition between property changes */
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

a.glidebutton > span:first-child{ /* first span inside button */
position: relative;
display: block;
height: 100%;
padding: 6px; /* padding of button */
-moz-box-sizing: border-box;
box-sizing: border-box;
-moz-transition: all 0.3s ease-in-out; /* Enable CSS transition between property changes */
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

a.glidebutton > span:first-child:after{ /* CSS generated content */
content: attr(data-text); /* Duplicate text of span markup */
display: block;
width: 100%;
height: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: inherit;
position: absolute;
top:100%;
left:0;
}

a.glidebutton:hover{
color: black; /* color of button on hover */
background: #72cb47; /* bg color of button on hover */
box-shadow: 0 0 4px green inset;
}

a.glidebutton:hover > span:first-child{
-moz-transform: translateY(-100%);
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%);
}
/* ----------------------------- كود القائمة فى الاقسام بخلفيه متحركه----------------------------- */




توقيع : berber





الثلاثاء 16 سبتمبر - 16:22:55
المشاركة رقم:
مشرف
مشرف

avatar

إحصائيةالعضو

عدد المساهمات : 6086
تاريخ التسجيل : 12/08/2014
مُساهمةموضوع: رد: كود القائمة فى الاقسام بخلفيه متحركه--css


كود القائمة فى الاقسام بخلفيه متحركه--css


شكرا1





الموضوعالأصلي : كود القائمة فى الاقسام بخلفيه متحركه--css // المصدر : منتديات بربار التعليمية //الكاتب: هنا جلال


توقيع : هنا جلال








الــرد الســـريـع
..



الذين يشاهدون محتوى الموضوع الآن : 20 ( الأعضاء 3 والزوار 17)



تعليمات المشاركة
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة


منتدى تحضير بكالوريا 2017 قسم السنة الرابعة متوسط شهادة المتوسط BEM 2017منتديات جواهر ستار التعليمية