طريقة عمل قائمة علوية ثابثة مع مزايا جوكيري رائعة

بـارق امـل · #1 2012-02-07, 01:18 PM

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

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

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

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

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

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

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

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

  <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>

♥ أخيرا قم بأضافة الكود التالي بآخر قالب " header " :

  <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>

وبس , ان شاء الله نالت على اعجابكم

المصدر :- ترايدنت

الموضوع الأصلي: طريقة عمل قائمة علوية ثابثة مع مزايا جوكيري رائعة || الكاتب: بحـر آلمشآعر || المصدر: منتدى ورود نت

ورود نت

ورود نت , تصاميم , توبيكات , دروس فوتوشوب , إستايلات , صور , ديكورات , الورد نت

2012-02-10, 07:17 PM

الله يعطيك العااافيه

2012-02-10, 11:55 PM

المشاركة الأصلية كتبت بواسطة خطآكـ ضيعـ غلآكـ

الله يعطيك العااافيه

الله يعافيك على مرورك , لاهنتي

2012-02-11, 12:22 AM

تسلم الايادي على الرووعه

2012-02-11, 12:24 AM

المشاركة الأصلية كتبت بواسطة النادر

تسلم الايادي على الرووعه

الله يعافيك على مرورك , لاهنت

2012-02-29, 06:37 PM

رااااائع جداً

طريقه مميزه ربي يعافيك على روعة اختيارك

2012-03-01, 02:24 PM

المشاركة الأصلية كتبت بواسطة بـارق امـل

رااااائع جداً
طريقه مميزه ربي يعافيك على روعة اختيارك

الله يعافيك على مرورك , لاهنتي

2012-03-01, 03:07 PM

الف شكر لسموك على الطرح الرائع

2012-03-03, 12:37 AM

المشاركة الأصلية كتبت بواسطة نديم الصمت

الف شكر لسموك على الطرح الرائع

الله يعافيك على مرورك , لاهنت

أدوات الموضوع
مشاهدة صفحة طباعة الموضوع أرسل هذا الموضوع إلى صديق
طرق العرض
العرض العادي الانتقال إلى العرض المتطور الانتقال إلى العرض الشجري

المواضيع المتشابهه
الموضوع	كاتب الموضوع	المنتدى	مشاركات	آخر مشاركة
كل المزايا تلاقيها بـ نجدية , فخمة وفيها مزايا حيل فتانه	بحـر آلمشآعر	ورود رياض القصيد والخواطر وعذب الكلام	6	2011-12-06 12:22 AM
طريقة عمل فواصل لـ الكتب بطريقة رائعة	بحـر آلمشآعر	ورود الصور بأنواعها وعدسات الكاميرا	10	2011-10-15 11:18 PM
خيال الظلسرقات علنية	بـارق امـل	ورود هتاف الاخبار ماتناقلته الصحف	1	2011-07-17 12:36 PM
أكسسوارات رائعة , أسوارات رائعة	بحـر آلمشآعر	ورود حواء ماركات نسائيه بنات ورود	6	2011-04-23 08:19 PM
على بند الرواتب المقطوعة وليست ثابتة ومدة العقد سنة قابلة للتجديد وظائف شاغرة بوزارة	بـارق امـل	ورود هتاف الاخبار ماتناقلته الصحف	0	2011-03-02 02:10 AM

التميز في ورود نت
العضو المميز	الموضوع المميز

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

الإهداءات