بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
لقد مللنا من الطريقة القديمة
ونود طريقة
جديدة في ظهور
اسماء
الأعضاء في المنتدى
اقدم لكم اليوم طريقة
جديدة في عمل اسماء
الأعضاء
وهي: اسماء
الأعضاء في مربعات متحركة من اليسار الى اليمين
ومثال على العمل :
طريقة التركيب
لوحة التحكم --> التحكم بالإستايلات --> تعاريف CSS الإضافية نضع بها التالي :
رمز Code:
.red
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #FF1515;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FF1515;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw2.gif');
text-align:center;
}
.green
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #006600;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#006600;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw1.gif');
text-align:center;
}
.blue
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #0000FF;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#0000FF;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw3.gif');
text-align:center;
}
.fushia
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #FF66CC;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FF66CC;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw5.gif');
text-align:center;
}
.orang
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #FF9900;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#FF9900;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw9.gif');
text-align:center
}
.black
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #000000;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#000000;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw8.gif');
text-align:center;
}
.brown
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #8B2323;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#8B2323;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw10.gif');
text-align:center;
}
.pink
{
margin: 0px 0px 0px 0px;
width: 48;
border: 2px solid #CC33FF;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#CC33FF;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw6.gif');
text-align:center;
}
.sama
{
margin: 0px 0px 0px 0px;
width:48;
border: 2px solid #8CE2FF;
cursor: pointer;
font-family:MS Sans Serif;
font-size:10px;
vertical-align:middle;
letter-spacing:0;
color:#8CE2FF;
padding-left:0;
padding-right:0;
padding-top:0;
padding-bottom:0;
background-color:#FFE3DF;
background-image: url('images/aqw4.gif');
text-align:center;
}
وبعدها :
نروح الى التحكم بالمجموعات ونحط : في المربع اليمين :
رمز Code:
ولا تنسى ترفع محتويات الملف : aqw الى محلد images
وطبعا ملف aqw في المرفق
الألوان :
red green blue fushia orang black brown pink sama
ملاحظة : بصراحة التصميم والعمل انا الي صممته .
وبكدة بنكون خلصنا من العمل الجديد .