Floating Sidebar Widget - Cố định Widget khi scroll chuột

Thảo luận trong 'Mã nguồn mở Xenforo' bắt đầu bởi tranvcuong94, 7/6/16.

  1. tranvcuong94

    tranvcuong94 Moderator Moderator

    Tham gia ngày:
    9/4/16
    Bài viết:
    228
    Đã được thích:
    1
    Điểm thành tích:
    18
    Giới tính:
    Nam
    Nghề nghiệp:
    N/A
    Nơi ở:
    N/A
    Web:
    N/A

    Yêu cầu cài add-on Widget FrameWork
    Mở template navigation tìm

    CODE:
    Select All
    <div class="navTabs">
    Thay bằng

    CODE:
    Select All
    <div class="navTabs" id="topmenu">
    Download file đính kèm, tải lên và giải nén vào thư mục js trên host. Mở file fixed.js sửa id widget cho phù hợp.

    Thêm cách chỉnh sửa by admin
    update
    Sửa nội dung file fixer.js và cấu hình theo code sau

    CODE:
    Select All
    <script>
    var 
    $stickyHeight 470// chiều cao của div cần sticky
    var $padding 0// khoảng cách từ top xuống div cần sticky, cái này thường bằng 0 nếu header của bạn fix thì bạn cài bằng chiều cao header
    var $topOffset 1170// Khoảng cách div cần sticky bắt đầu hoạt động
    var $footerHeight 310// Định vị điểm dừng của banner, tính từ chân lên (cài theo chiều cao của footer)
    /* <=!=[=C=D=A=T=A=[ */
    function scrollSticky(){
    if($(
    window).height() >= $stickyHeight) {
        var 
    aOffset = $('#sticky').offset();
    if($(
    document).height() - $footerHeight $padding < $(window).scrollTop() + $stickyHeight) {
            var 
    $top = $(document).height() - $stickyHeight $footerHeight $padding 185;
            $(
    '#sticky').attr('style''position:absolute; top:'+$top+'px;');


        }else if($(
    window).scrollTop() + $padding $topOffset) {
            $(
    '#sticky').attr('style''position:fixed; top:'+$padding+'px;');
    }else{
            $(
    '#sticky').attr('style''position:relative;');
        }
    }
    }
    $(
    window).scroll(function(){
    scrollSticky();
    });
    /* ]=]=> */
    </script>
    CODE:
    Select All
    <div id="sticky">
    Code quảng cáo
    </div>
    Thay sticky bằng id của Sidebar bạn cần dùng. Chúc các bạn thành công.

    Demo:

    DEMO.JPG

    Nguồn: vnxf.vn
     

    Tập tin đính kèm:

    • js.zip
      Kích thước:
      2.2 KB
      Đọc:
      1,274

    Bình Luận Bằng Facebook

    data-href="https://cnttqn.com/threads/floating-sidebar-widget-co-dinh-widget-khi-scroll-chuot.2039.html"