منتديات عرب فوكس

أهلا وسهلا بك إلى منتديات عرب فوكس




منتديات عرب فوكس :: تطوير المواقع والمنتديات :: اكواد CSS

شاطر

السبت مارس 02, 2013 9:22 am
المشاركة رقم:
مؤسس المنتدى
مؤسس المنتدى

avatar

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

ذكر
عدد المساهمات : 1248
تاريخ التسجيل : 02/02/2013
معاينة صفحة البيانات الشخصي للعضو http://arabsfox.ahlamontada.com
مُساهمةموضوع: أكواد التأثيرات الخاصة بعلبة الدردشة


أكواد التأثيرات الخاصة بعلبة الدردشة


أكواد التأثيرات الخاصة بعلبة الدردشة

من طرف s@kr في الخميس 11 يونيو - 23:16



السلام عليكم
اليوم جبتلكم كود رائع لوضع خلفية لعلبة الدردشة
مثال :



الكود: ---------تضليل المحتوىbody.chatbox {
background-image : url(ضع هنا رابط الصورة);
background-color : #dddddd;
border : 2px dotted #0db4fc;
}
الكود يوضع بورقة css
لوحة الادارة
مظهر المنتدي
الوان
ورقة تصميم css




-----------
ارجوا ان اكون افدتكم
انتهي الموضوع

تحياتي

s@kr
المتطوع المساعد


عدل سابقا من قبل s@kr في الجمعة 12 يونيو - 2:27 عدل 1 مرات

s@kr



عدد المساهمات: 22610
معدل النشاط: 20325













تقنية عمل عنوان للدردشة + عمل حركات

من طرف tnt7000 في الإثنين 21 يونيو - 15:43




السلام عليكم

هدا الكود لعمل عنوان للدردشة + عمل حركات

الكود: ---------تضليل المحتوى
#chatbox_header a.cattitle{
display:none;
}
#chatbox_header
td.catBottom{
background:transparent
url(https://redcdn.net/ihimizer/img682/8858/007x.gif) no-repeat scroll 0
0;
}

يمكن التغيير فيه حسب الطلب غير الصور بس

https://redcdn.net/ihimizer/img682/8858/007x.gif

نضعه كالتالي

مضهر المنتدى

صور والوان / الوان

ورقة
تصميم CSS


TNT7000

tnt7000



عدد المساهمات: 1526
معدل النشاط: 3215













كود لوضع خلفيه لازرار علبه الدردشه (ahmedMido)

من طرف Ahmed M!Do في الأحد 2 يناير - 20:00








مرحبا بكمـ ..

وتتواله حصريات Ahmed Mido





كود لوضع خلفيه لازرار علبه الدردشه (ahmedMido)

لكل النسخ



الكود



الكود: ---------تضليل المحتوى
/* --------لوضع خلفيه لازرار علببه الدردشه ------------ */

.fontbutton {
background-image: url("https://2img.net/h/i716.photobucket.com/albums/ww161/style-x_images/christmas-X/thindex.jpg");
color: #870511;
border: 1px solid #ffec86;
}
/* --------AhmedMido ----------- */





يمكنك تغير الخلفيه بدل هذا الرابط






https://2img.net/h/i716.photobucket.com/albums/ww161/style-x_images/christmas-X/thindex.jpg




صوره للكود قبل وضعه وبعد وضع الكود




صوره قبل وضع الكود









صوره بعد وضع الكود











شرح وضع الكود





لوحه التحكم

مظهر المنتدى

الصور و الألوان

الوان

ورقه تصميم الـــ Css




تم الشرح بواسطة


المتطوع المساعد

Ahmed Mido




ارجو ان اكود قد وفقت
في الشرح





الكود حصري
ولا اسمح بنقله بدون المحافظة على الحقوق
والله شهيد علي الجميع






Ahmed M!Do



عدد المساهمات: 13523
معدل النشاط: 12659













تغيير اللوان ازرار علبة الدردشة

من طرف new.moon في السبت 28 مايو - 11:02



السلام عليكم


كود يختص بتغير اللوان ازرار علبة الدردشة

النتيجة
https://i.servimg.com/u/f22/13/32/96/23/pictur90.gif


الكود يوضع في يورقة الـcss

لوحة الادارة>مظهر المنتدى>اللوان>ورقة تصميم الـcss






الكود: ---------تضليل المحتوى#divsmilies{background-color: #cc9900;

}
#divcolor{background-color: #006633;

}
#divstrike{background-color: #993300;

}
#divunderline{background-color: #990099;

}
#divitalic
{background-color: #cc6600;

}
#divbold
{background-color: #33cccc;

}




تحياتي لجميع الاخوى
الكود من تطوير
YASIR




new.moon



عدد المساهمات: 4733
معدل النشاط: 5515













كود css لجعل كلمة التحق بالدردشة تظهر وتختفي اكثر من مرة

من طرف ثامر محمد السالمي في الخميس 11 أغسطس - 1:35



بسم الله الرحمن الرحيم
كود لجعل كلمة التحق بالدردشة تظهر وتختفي اكثر من مرة
الكود: ---------تضليل المحتوى
html#min-width
body table.bodylinewidth tbody tr td.bodyline div#page-body
div#content-container table.three-col tbody tr td table.forumline tbody
tr td.row1 span.gensmall div#chatbox_popup a{
text-decoration: blink;
text_editor_textarea
text-align: center;
}
يوضع فى
لوحة الادارة
مظهر المنتدى
صور و الالوان
الالوان
ورقه تصميم ال css


ثامر محمد السالمي



عدد المساهمات: 227
معدل النشاط: 1192













كود css لتطوير صندوق الدردشة لجعله اكثر احترافية

من طرف asmaa.fr في الثلاثاء 20 سبتمبر - 23:57


| ₪|سلامٌ عليكم و رحمةٌ من اللهِ و بركاته | ₪| ..

مرحباً بكم أيها الكرام من أعضاء و زوار

الكود يركب بورقة css


النسخة الثانية Css For Phpbb 2 l


الكود: ---------تضليل المحتوى#chatbox_main_options, #chatbox_main_options a, #chatbox_main_options span{
color: #9a9a9a;
text-shadow: 1px 1px 1px #ffffff;
text-decoration:none;
font-family: Arial Black;
text-transform: uppercase;
}
#chatbox_main_options a:hover{
color: grey;
text-shadow: 1px 1px 1px #b8b8b8;
text-decoration:none !important;
font-family: Arial Black;
text-transform: uppercase;
}

#chatbox_main_options {
background: url(https://i.servimg.com/u/f25/14/45/99/41/untitl21.jpg) repeat-x;
float: right;
border: 1px solid #c9c9c9;
margin-right: 50px;
margin-top: -17px;
padding: 2px 3px 1px 5px;
border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
-webkit-box-shadow: 0px 0px 4px #c6c6c6;
box-shadow: 0px 0px 4px #c6c6c6;
-moz-box-shadow: 0px 0px 4px #c6c6c6;
}
#chatbox_main_options:hover {
margin-top: -7px;
}
/*----------------Members----------------*/
#chatbox_members {
background: url(https://i.servimg.com/u/f25/14/45/99/41/50347510.png);
margin-bottom: -30px;
border-right: 1px solid #c9c9c9;
background-color: #ffffff;
}
#chatbox_members:hover {
border-right: 1px solid #b7b7b7;
background-color: #fcfcfc;
}
h4.member-title{
background: url(https://i.servimg.com/u/f25/14/45/99/41/untitl23.jpg) repeat-x !important;
font-family: Arial Black;
text-transform: uppercase;
color: #ffffff !important;
text-shadow: 0px 0px 3px black;
margin-top: -1px;
cursor: default;
letter-spacing: 0.5em;
}

#chatbox_members ul {
list-style: none;
margin: 0px;
}
#chatbox_members ul li {
background: url(https://i.servimg.com/u/f25/14/45/99/41/115.png);
font-family: Arial Black;
font-weight: bold;
font-size: 14px;
color: #393939;
padding-left: 10px;
border-bottom: 1px solid #e2e2e2;
margin: 0px;
}

#chatbox_members ul li:hover {
background-color: #f4f4f4;
background-image:url('https://i.servimg.com/u/f25/14/45/99/41/114.png');
background-repeat: no-repeat;
background-position: center left;
}
#chatbox_members ul li:active {
background-image:url('https://i.servimg.com/u/f25/14/45/99/41/213.png');
}
#chatbox_members ul li a {
text-shadow: 1px 1px 1px #ffffff;
font-size: 12px;
color: #909090;
text-decoration: none;
}
#chatbox_members ul li a:hover {
color: #393939;
text-decoration: none !important;
}



























/*----------------Footer----------------*/
#chatbox_messenger .catBottom{
background: none !important;
}
#chatbox_messenger_form {
width: 550px;
background: none !important;
float: none !important;
bottom: 0px ;
position: fixed;
z-index: 999;
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
}
.chatfootertable {
-webkit-box-shadow: 0px 0px 4px #d4d4d4;
box-shadow: 0px -0px 4px #d4d4d4;
-moz-box-shadow: 0px 0px 4px #d4d4d4;
box-shadow: 0px 0px 4px #c6c6c6;
-moz-box-shadow: 0px 0px 4px #c6c6c6;
border-top: 1px solid #c9c9c9;
border-left: 1px solid #c9c9c9;
border-right: 1px solid #c9c9c9;
border-bottom: 0px;
height: 30px;
border-radius: 5px 5px 0px 0px;
-moz-border-radius: 5px 5px 0px 0px;
background-color: #ffffff;
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f9f9f9));
background: -moz-linear-gradient(top, #ffffff, #e2e2e2);
}
.chatfootertable:hover {
border-top: 1px solid #a7a7a7;
border-left: 1px solid #a7a7a7;
border-right: 1px solid #a7a7a7;
}
.text-styles {
color: grey;
}
#divbold, #divitalic, #divunderline, #divstrike, #divcolor, #divsmilies {
background: url(https://i.servimg.com/u/f25/14/45/99/41/110.jpg) repeat-x;
border: 1px solid #c9c9c9;
background-color: #ffffff;
border-radius: 3px;
-moz-border-radius: 3px;
}
#divbold:hover, #divitalic:hover, #divunderline:hover, #divstrike:hover, #divcolor:hover, #divsmilies:hover {
background: url(https://i.servimg.com/u/f25/14/45/99/41/hover10.jpg) repeat-x;
border: 1px solid #a2a2a2;
}
#divbold:active, #divitalic:active, #divunderline:active, #divstrike:active, #divcolor:active, #divsmilies:active {
background: url(https://i.servimg.com/u/f25/14/45/99/41/active10.jpg) repeat-x;
}
.gen label input#message {
height: 17px;
font-size: 12px;
border: 1px solid #c9c9c9;
background-color: #ffffff;
border-radius: 3px;
-moz-border-radius: 3px;
}
.gen label input#message:hover {
border: 1px solid #b2b2b2;
background-color: #f5f5f5;
}
.gen label input#message:focus {
border: 1px solid #a4a4a4;
background-color: #e0fdff;
}
.gen input#submit_button {
cursor: pointer;
color: #929292;
font-family: Arial Black;
text-transform: uppercase;
font-size: 12px;
padding-left: 2px;
padding-right: 2px;
background: url(https://i.servimg.com/u/f25/14/45/99/41/110.jpg) repeat-x;
border: 1px solid #c9c9c9;
background-color: #ffffff;
border-radius: 3px;
-moz-border-radius: 3px;
}
.gen input#submit_button:hover {
color: #2c2c2c;
background: url(https://i.servimg.com/u/f25/14/45/99/41/hover10.jpg) repeat-x;
border: 1px solid #a2a2a2;
}
.gen input#submit_button:active {
background: url(https://i.servimg.com/u/f25/14/45/99/41/active10.jpg) repeat-x;
}

صورة للكود

http://im17.gulfup.com/2011-09-21/1316609842841.jpg
طريقة الوضع : لوحة الادارة/مظهر
المنتدي/الصور والالوان /الوان/ورقة تصميم css

تظهر مكان عبة الدردشة فهي مثلها ولاكن مطورة
بالتوفيق لكم
المتطوعة
asmah1234567

عدل سابقا من قبل asmah1234567 في الأربعاء 21 سبتمبر - 23:35 عدل 1 مرات

asmaa.fr



عدد المساهمات: 6217
معدل النشاط: 7095













[ CSS ] أكواد التحكم بالخط في علبة الدردشة

من طرف Lord-adoain في السبت 31 ديسمبر - 14:44



<table style="border: 1px solid rgb(0, 114, 149);" cellspacing="0" width="100%"><tr><td style="background-image: url(https://i.servimg.com/u/f23/14/33/99/93/1110.png); background-repeat: no-repeat;" align="left" height="100" width="152">
</td><td style="background: url(https://i.servimg.com/u/f62/09/02/12/09/repet10.png) repeat scroll 0% 0% transparent; padding-bottom: 15px;" align="left">
تغيير حجم الكتابة في علبة الدردشة

</td><td style="background-image: url(http://download.mrkzy.com/e/0611_md_13206201151.png); background-repeat: no-repeat;" align="left" width="84">
</td></tr></table><table style="border-left: 1px solid rgb(0, 114, 149); border-right: 1px solid rgb(0, 114, 149); border-bottom: 1px solid rgb(0, 114, 149);" cellspacing="0" width="100%"><tr><td style="padding-left: 5px; padding-right: 5px; background-color: rgb(247, 247, 247);" align="left">



كود [ CSS ] للتحكم في حجم الخط في علبة الدردشة


  • صورة قبل إستخدام الكود : هنا
  • صورة بعد إستخدام الكود : هنا


الكود :-
الكود: ---------تضليل المحتوى#chatbox .user-msg {
font-size:27px;
font-weight: bold;
}

مع العلم أن الكود يعمل مع النسخة الثانية phpbb2 فقط


* يمكن التحكم في حجم الخط عبر التغيير في الرقم 27 المتواجد في الكود

الطريقة الموحدة لوضع أكواد CSS

لوحة الإدارة --> مظهر المنتدى --> الوان --> ورقة تصميم CSS

وإلى اللقاء مرة أخرى
lord-adoain
</td></tr></table><table style="border-left: 1px solid rgb(0, 114, 149); border-right: 1px solid rgb(0, 114, 149); border-bottom: 1px solid rgb(0, 114, 149); table-layout: fixed; width: 100%;" cellspacing="0"><tr><td style="text-align: justify; background: none repeat scroll 0% 0% rgb(247, 247, 247); padding-left: 5px;" align="left">
</td></tr></table>

Lord-adoain



عدد المساهمات: 40310
معدل النشاط: 37077













كود وضع خلفية ووضع الكتابة بالمائل في علبة الدردشة بشكل إحترافي

من طرف new.moon في السبت 31 ديسمبر - 14:46



<table style="border: 1px solid rgb(0, 114, 149);" cellspacing="0" width="100%"><tr><td style="background-image: url(https://i.servimg.com/u/f23/14/33/99/93/1110.png); background-repeat: no-repeat;" align="left" height="100" width="152">
</td><td style="background: url(https://i.servimg.com/u/f62/09/02/12/09/repet10.png) repeat scroll 0% 0% transparent; padding-bottom: 15px;" align="left">
كود وضع خلفية ووضع الكتابة بالمائل في علبة الدردشة بشكل إحترافي

</td><td style="background-image: url(http://download.mrkzy.com/e/0611_md_13206201151.png); background-repeat: no-repeat;" align="left" width="84">
</td></tr></table><table style="border-left: 1px solid rgb(0, 114, 149); border-right: 1px solid rgb(0, 114, 149); border-bottom: 1px solid rgb(0, 114, 149);" cellspacing="0" width="100%"><tr><td style="padding-left: 5px; padding-right: 5px; background-color: rgb(247, 247, 247);" align="left">


كود css
كود وضع خلفية ووضع الكتابة بالمائل في علبة الدردشة بشكل إحترافي

صورة إستخدام الكود : هنا


الكود :-
الكود: ---------تضليل المحتوى#chatbox .user-msg {-webkit-transition: -webkit-transform .15s linear;
-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
padding: 5px 5px 5px 5px;
-webkit-transform: rotate( 2deg);
-moz-transform: rotate( 2deg);
}



مع العلم أن الكود يعمل مع النسخة الثانية phpbb2 فقط

الطريقة الموحدة لوضع أكواد CSS

لوحة الإدارة --> مظهر المنتدى --> الوان --> ورقة تصميم CSS

أحلى خبــــير اكواد
new.moon
</td></tr></table><table style="border-left: 1px solid rgb(0, 114, 149); border-right: 1px solid rgb(0, 114, 149); border-bottom: 1px solid rgb(0, 114, 149); table-layout: fixed; width: 100%;" cellspacing="0"><tr><td style="text-align: justify; background: none repeat scroll 0% 0% rgb(247, 247, 247); padding-left: 5px;" align="left">
</td></tr></table>

new.moon



عدد المساهمات: 4733
معدل النشاط: 5515













[css]كود توهج النص والتاريخ في علبه الدردشه

من طرف new.moon في الثلاثاء 24 يناير - 2:12






الســــــــــــــــــــلام عليكم و رحمه الله و بركاته





كود css
كود توهج النص والتاريخ واسماء الاعضاء في علبه الدردشه

صورة إستخدام الكود :هنــــــــــــــــــــــا

الكود :-
الكود: ---------تضليل المحتوى /* For information text */
p.chatbox_row_1 span.date-and-time, p.chatbox_row_1 span.msg span strong{
text-shadow:0px 2px 13px #f5a911 !important;
}

/* For message text */
p.chatbox_row_1 span.msg span{
text-shadow:0px 2px 13px #f5a911 !important;
}

/* For connected users list */
p.chatbox_row_1 ul.online-users li a span strong{
text-shadow:0px 2px 13px #f5a911 !important;
}

ملاحظة: لتغير لون التوهج تستطيع ذالك من خلال استبدال
#f5a911 الى اللون الي يعجبك






طريقه تركيب الكودCSS

لوحة الإدارة --> مظهر المنتدى --> الوان --> ورقة تصميم CSS

أحلى خبــــير اكواد
new.moon


عدل سابقا من قبل zhegazy في الخميس 1 مارس - 20:44 عدل 4 مرات (السبب : اضافه بعض التوضيحات)

new.moon



عدد المساهمات: 4733
معدل النشاط: 5515













نقدم لكم كود جديد ورائع وضع اطار لاسم العضو في الدردشه فقط ::new.moon

من طرف new.moon في الثلاثاء 28 فبراير - 18:39






نقدم لكم كود جديد ورائع وضع اطار لاسم العضو في الدردشه فقط

للمعاينه :: هنا اضغط

الكود ::
الكود: ---------تضليل المحتوى

#chatbox .user {
background: url(https://i.servimg.com/u/f80/14/20/95/39/butt1110.gif);
font: 11px georgia !important;
border-color : #2DB9E3 !important;
}

لتغير الخلفيه الداخليه خلف الاسم
غير الرابط::
<blockquote>
https://i.servimg.com/u/f80/14/20/95/39/butt1110.gif</blockquote>
لاي صوره لديك


طريقة وضع الكود

::
لوحة الادارة

مظهر المنتدى
الصور والالوان
الوان
ورقة تصميم الـ Css
ثم ضع الكود

ثم قدم :: ثم سجل


مبروك عليكم الكود من تطوير ياسر new.moon

احلى تحية



عدل سابقا من قبل new.moon في الثلاثاء 28 فبراير - 19:09 عدل 1 مرات

new.moon



عدد المساهمات: 4733
معدل النشاط: 5515













كود css لتوسيط كلام علبة الدردشة

من طرف zayalnser في السبت 7 يوليو - 15:34



كود لتوسيط كلام علبة الدردشة

صوره للكود






الكود: ---------تضليل المحتوى body.chatbox{
text-align: center;
}


طريقه وضع الكود:
مظهر المنتدي >الوان >ورقه تصميم css
وضع الكود هنااااك

ارجو ان اكون افدتكم





توقيع : admin_site




السبت مارس 02, 2013 9:24 am
المشاركة رقم:
مؤسس المنتدى
مؤسس المنتدى

avatar

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

ذكر
عدد المساهمات : 1248
تاريخ التسجيل : 02/02/2013
معاينة صفحة البيانات الشخصي للعضو http://arabsfox.ahlamontada.com
مُساهمةموضوع: رد: أكواد التأثيرات الخاصة بعلبة الدردشة


أكواد التأثيرات الخاصة بعلبة الدردشة


للعلم الموضوع منقوووووول




توقيع : admin_site







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

خدمات الموضوع
 KonuEtiketleri كلمات دليليه
 Konu Linki رابط الموضوع
 Konu BBCode BBCode
 Konu HTML Kodu HTML code
إذا وجدت وصلات لاتعمل في الموضوع او أن الموضوع [ أكواد التأثيرات الخاصة بعلبة الدردشة ] مخالف ,, من فضلك راسل الإدارة من هنا


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


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

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