🌹 منتديات جسور التواصل 🌹 تجمع عربي للنقاش الجاد وتبادل المعارف والآراء

تطوير المواقع [ كود ] : ₪ كـود بنـرات المواضيع الممـيزة والحصـرية بتأثير css hover ₪

المستقل
الانتساب : 22-03-2010
عدد المشاركات : 2,480
[ كود ] : ₪ كـود بنـرات المواضيع الممـيزة والحصـرية بتأثير css hover ₪
تم تحديث الموضوع يوم الإثنين الساعة ( 1 ليلاً )
يرجى إعدة تركيب الأكواد

كود بتقنية css وتأثير hover ينفع لفعاليات المنتدى والمواضيع المميزة والحصرية .
الكود عبارة عن 6 بنرات قابلة لزيادة, البنرات عليها تأثير يجعلها مظللة وبمجرد مرور الماوس توضح.

الإعداد الأول للكود كان بواسطة الأخ : Solar Attack .
وتم التعديل عليه من قبل الأخ : -==Zero==- , ليتوافق مع جميع المتصفحات .
ترتيب الكود تم بواسطتي : ساعة زمن .

لمشاهدة مثال على الكود : " الكود في مربع الملاحظات "
https://www.sa3atzaman.com/vb

طريقة التركيب كأي كود فقط عدل الكود بما يناسبك بعد ذلك قم بإضافته بالمكان المناسب, من رأيي الملاحظات مكان مناسب جداً.


وراح اوضح لكم طريقة التركيب :

1- قم بإضافة الكود التالي في (تعاريف CSS الإضافية/Additional CSS Definitions)
ملاحظة: عدل روابط الصور بما يناسبك, كذلك المقاسات .

كود PHP:
/* ***** الفعاليات ***** */
#solar-img {
background:url('https://www.sa3atzaman.com/vb/images/New-Events/soon.gif') no-repeat;
height:148px; width:122px; filter:alpha(opacity=50);
-
moz-opacity: 0.5;
opacity: 0.5;
-
khtml-opacity: 0.5;
}
#solar-img:hover{filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-
khtml-opacity: 1.0;}

#solar-img2 {
background:url('https://www.sa3atzaman.com/vb/images/New-Events/soon.gif') no-repeat;
height:148px; width:122px; filter:alpha(opacity=50);
-
moz-opacity: 0.5;
opacity: 0.5;
-
khtml-opacity: 0.5;
}
#solar-img2:hover{filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-
khtml-opacity: 1.0;}

#solar-img3 {
background:url('https://www.sa3atzaman.com/vb/images/New-Events/soon.gif') no-repeat;
height:148px; width:122px; filter:alpha(opacity=50);
-
moz-opacity: 0.5;
opacity: 0.5;
-
khtml-opacity: 0.5;
}
#solar-img3:hover{filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-
khtml-opacity: 1.0;}

#solar-img4 {
background:url('https://www.sa3atzaman.com/vb/images/New-Events/soon.gif') no-repeat;
height:148px; width:122px; filter:alpha(opacity=50);
-
moz-opacity: 0.5;
opacity: 0.5;
-
khtml-opacity: 0.5;
}
#solar-img4:hover{filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-
khtml-opacity: 1.0;}

#solar-img5 {
background:url('https://www.sa3atzaman.com/vb/images/New-Events/soon.gif') no-repeat;
height:148px; width:122px; filter:alpha(opacity=50);
-
moz-opacity: 0.5;
opacity: 0.5;
-
khtml-opacity: 0.5;
}
#solar-img5:hover{filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-
khtml-opacity: 1.0;}

#solar-img6 {
background:url('https://www.sa3atzaman.com/vb/images/New-Events/soon.gif') no-repeat;
height:148px; width:122px; filter:alpha(opacity=50);
-
moz-opacity: 0.5;
opacity: 0.5;
-
khtml-opacity: 0.5;
}
#solar-img6:hover{filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-
khtml-opacity: 1.0;}



2- أضف الكلاسات التالية في المكان المراد ظهور الصور فيه :
ملاحظة: قم بتعديل وصف الصورة ورابطها بما يناسبك.

كود PHP:






?{.
ـالْمَوَآضِيْع ـالْمُمَيِّزَة وَـالحَصَرِيّة .}?


















أتمنى عدم إزالة الحقوق

-----------------------------------------

مواضيع متعلقة بتقنية css :
تـغيير شكـل الـوقت ولـونه بطريقـة مختلفـة ومميزة css √
https://www.rawabetvb.com/vb/showthread.php?t=228512
تاريخ هذه المشاركة : 09-04-2011
مواضيع المستقل في جسور التواصل

وردة الخال
الانتساب : 01-04-2013
عدد المشاركات : 4,273
شكرا لك

تاريخ هذه المشاركة : 16-07-2013

ماجدة سطايفية
الانتساب : 22-11-2012
عدد المشاركات : 5,263


تاريخ هذه المشاركة : 18-07-2013

أسرار الحب
الانتساب : 19-12-2013
عدد المشاركات : 8,349
بارك الله فيك
دام عطاؤك في جسور التواصل
تاريخ هذه المشاركة : 19-08-2018
مواضيع أسرار الحب في جسور التواصل


الرسالة: