بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
بعد ان قمت بالإقتراح وعجب الأخ سليمان بارك الله فيه
هذا تعديل بسيط يمثل ما اقترحت ويمكن التعديل فيه حتى يكون متناسق أكثر فأكثر للمعاية انظر الصورة المرفقة
التركيبأولا افتح style.css اضف التالي :
CODE
[LEFT]#vtab {
margin: 0px 9px 0px 0px;
width: 98%;
}
#vtab > ul > li {
cursor:pointer;
width: 110px;
height: 110px;
background-color: #fff !important;
list-style-type: none;
display: block;
text-align: center;
margin: auto;
padding-bottom: 10px;
border: 1px solid #fff;
position: relative;
border-right: none;
opacity: .3;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
}
#vtab > ul > li.home {
background: url('images/profinfo.png') no-repeat center center;
}
#vtab > ul > li.login {
background: url('images/otherdet.png') no-repeat center center;
}
#vtab > ul > li.support {
background: url('images/Gestepm.png') no-repeat center center;
}
#vtab > ul > li.selected {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
border: 1px solid #ddd;
border-right: none;
z-index: 10;
background-color: #fafafa !important;
position: relative;
}
#vtab > ul {
float:left;
width: 110px;
text-align: left;
display: block;
margin: auto 0;
padding: 0;
position: relative;
top: 30px;
}
#vtab > div {
background-color: #fafafa;
margin-left: 110px;
border: 1px solid #ddd;
min-height: 401px;
padding: 12px;
position: relative;
z-index: 9;
-moz-border-radius: 20px;
}
#vtab > div > h4 {
color: #800;
font-size: 1.2em;
border-bottom: 1px dotted #800;
padding-top: 5px;
margin-top: 0;
}[/LEFT]
ثم
افتح القالب headinclud وأضف قبل <title> التالي :
CODE
[LEFT]<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<!--[if IE 7]>
<style type="text/css">
#vtab > ul > li.selected{
border-right: 1px solid #fff !important;
}
#vtab > ul > li {
border-right: 1px solid #ddd !important;
}
#vtab > div {
z-index: -1 !important;
left:1px;
}
</style>
<![endif]-->
<script type="text/javascript">
$(function() {
var $items = $('#vtab>ul>li');
$items.mouseup(function() {
$items.removeClass('selected');
$(this).addClass('selected');
var index = $items.index($(this));
$('#vtab>div').hide().eq(index).show();
}).eq(1).mouseup();
});
</script>[/LEFT]
وبعدها قم باستبدال القالب profile بالمرفق وارفع الصور للمجلد images الخاص بالستايل
أو
تقوم باستبدال القوالب بالمرفقة الى C:\AppServ\www\forum\look\styles\forum\main\templates
وتستبدل styles.css في C:\AppServ\www\forum\look\styles\forum\main\style
وترفع الصور إلى مجلد C:\AppServ\www\forum\look\styles\forum\main\images
وشكرا