تثبيت القائمة الرئيسية عند التمرير إلى الأسفل.

مرحبا بكم في موقع لوكو تك - نرجوا أن تجدوا ما تبحثون عنه في الموقع - الموقع قيد التطوير حاليا - نرجوا منكم الاشتراك لدعمنا ×

تثبيت القائمة الرئيسية عند التمرير إلى الأسفل.

قد يحتاج زوار مدونتك إل طريقة سهلة إلى الوصول إلى جميع أقسام المدونة خاصة إذا كانت مدونتك مهمة بالنسبة لهم وهذا ما يدفعك إلى تجربة أي طريقة لتسهيل عملية التنقل بين أقسام الموقع دون الحاجة إلى الصعود إلى أعلى خاصة إذا كان الموضوع طويل فهذا يحتاج إلى بعض الوقت للوصول إلى أعلى ولكن مع هذه الطريقة إذا تمكنت من إتقانها فسوف تسهل عملية التنقل بجعل القائمة الرئيسية أو أي قائمة في المدونة تثبت عند التمرير إلى الأسفل في حين تثبت في حال عدم النزول إلى أسفل.

طريقة التنفيذ


1- اذهب إلى لوحة التحكم في بلوجر واختر قالب ومن ثم تحرير html .
2- ابحث عن الوسم   </body> يمكنك أن تجده في الأخير.
3- ضع قبله (فوقه) الكود التالي :-
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
    // Menentukan elemen yang dijadikan sticky yaitu .nav
    var stickyNavTop = $('#nav').offset().top;
    var stickyNav = function(){
        var scrollTop = $(window).scrollTop();
        // Kondisi jika discroll maka menu akan selalu diatas, dan sebaliknya      
        if (scrollTop > stickyNavTop) {
          $('#nav').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
        } else {
            $('#nav').css({ 'position': 'relative', 'width': '100%' });
        }
    };
    // Jalankan fungsi
    stickyNav();
    $(window).scroll(function() {
        stickyNav();
    });
});
//]]>
</script>
4- ننتقل إلى الخطوة الأخيرة وهي الأهم:
نبحث عن أي كلمة موجودة في القائمة المنسدلة ونذهب إلى معرف الروابط ونضع قبله الكود <div id='nav'>
 ونضغط حفظ وشاهد النتيجة.

 وقد تختلف الأكواد من مدونة إلى أخرى لكن إذا كان الشخص يتق التعامل مع الأكواد فلن يجد أي مشكلة في هذا الشرح, وأرجوا أن يكون الشرح مفهوماً ولكن أرجوا أن تكونوا من أعضاء المدونة من هنا وأن تشترك في قناة اليوتيوب من هنا والإعجاب بصفحة الفيس بوك من هنا .
وشكراً لكم وإلى اللقاء في درس جديد ومتنوع من تقديم مدونة لوكو تك كونوا في الإنتظار.

هناك تعليقان (2):

لا تنسى أن تدعمنا بتعليق

يتم التشغيل بواسطة Blogger.