[ ط´ط±ط* ] : ط¹ظ…ظ„ ظ‚ط§ط¦ظ…ط© ط¹ظ„ظˆظٹط© ط«ط§ط¨ط«ط© ظ…ط¹ ظ…ط²ط§ظٹط§ ط¬ظˆظƒظٹط±ظٹ ط±ط§ط¦ط¹ط©





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


موضوعي الثاني في هذا القسم عبارة عن " قائمة علوية ثابثة مع مزايا جوكيري رائعة "


♥ في بادئ الأمر أترككم مع مميزات القائمة :

- مكان ثابث في أعلى صفحة منتداك ~
- اختفاء القائمة عند النزول إلى أسفل أو وسط الصفحة لعدم حجب الرؤية ~
- القائمة تضم روابط على شكل أزرار بتقنية الــ CSS3 و زر العودة السريعة لأعلى الصفحة ~


♥ ثانيا أترككم مع المثال المصور :




♥ ثالثا نأتي للتركيب install :


♥ أولا وقبل شيء يجب عليك رفع المجلد " topbar " الموجود داخل الملف الملف المرفق الى مجلد المنتدى forum الرئيسي

♥ ثانيا قم بااضافة الكود code التالي باخر قالب template " headinclude " :


رمز PHP:
<code style="white-space:nowrap"> <code> <link href="topbar/style.css" rel="stylesheet" type="text/css" />


<script type="text/javascript">

$(function() {
$(window).scroll(function(){
var scrollTop = $(window).scrollTop();
if(scrollTop != 0)
$('#nav').stop().animate({'opacity':'0.2'},400);
else
$('#nav').stop().animate({'opacity':'1'},400);
});

$('#nav').hover(
function (e) {
var scrollTop = $(window).scrollTop();
if(scrollTop != 0){
$('#nav').stop().animate({'opacity':'1'},400);
}
},
function (e) {
var scrollTop = $(window).scrollTop();
if(scrollTop != 0){
$('#nav').stop().animate({'opacity':'0.2'},400);



}
}
);
});
</script>
</code> </code>



♥ أخيرا قم بأضافة الكود code التالي بآخر قالب template &quot; header &quot; :


رمز PHP:
<code style="white-space:nowrap"> <code> <div id="nav">
<ul>
<li><a class="top" href="#"><span></span></a></li>
<li><a> :: ديزاد باتنة ::</a></li>
<li><a> :: dev-vb ::</a></li>
<li><a> :: ديزاد باتنة ::</a></li>
<li><a> :: dev-vb ::</a></li>
<li><a> :: ديزاد باتنة ::</a></li>
<li><a> :: dev-vb ::</a></li>
<li><a> :: ديزاد باتنة ::</a></li>


</ul>
</div>
</code> </code>



♥ اذا أعجبك الموضوع لا تبخل على باعجاب أو تقييم








الملفات المرفقة [TR]
dev-vb.zip (12.3 كيلوبايت, عدد مرات المشاهدة 312 مرة) [/TR]



©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©