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

  • Thread starter Thread starter PVS
  • Ngày gửi Ngày gửi

PVS

Super Moderator
Thành viên BQT
Yêu cầu cài add-on Widget FrameWork
Mở template navigation tìm
Mã:
<div class="navTabs">

Thay bằng
Mã:
<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
Mã:
<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>

Mã:
<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.


Nguồn: congngheaz.com​
 

Đính kèm

  • js.zip
    js.zip
    2.2 KB · Lượt xem: 100
  • Like
Reactions: THB
cái này hay. hôm trước có bác hỏi nè. bên congnghe5giay nó dùng đấy. bác nào dùng thì cho ý kiến nha.
 
dao này dứt cáp nên chắc có nơi hơi bị "chạm". mình cũng vào bình thường nhưng chưa thấy cái cố định widget như congnghe5giay
 
Back
Top