滚动屏幕时更改容器的宽度

时间:2017-05-30 11:27:08

标签: javascript html css

我正在开发网站http://advm.space/kublse/

任务是我想在到达侧边栏末端时更改中心块的宽度(屏幕截图)。

提前谢谢! enter image description here

1 个答案:

答案 0 :(得分:0)

这是一种在用户滚动到元素末尾时更改容器或内容div块的宽度的简单方法:

$(document).ready(function(){       
   var scroll_start = 0;
   var startchange = $('#sidebar'); // when user reach the end of sidebar
   var offset = startchange.offset();
    if (startchange.length){
   $(document).scroll(function() { 
      scroll_start = $(this).scrollTop();
      if(scroll_start > offset.top) {
          $(".yourDiv").css('width', '1000px'); // check if the user reached to the end of sidebar, if yes then change the width of your div.
       } else {
          $('.yourDiv').css('width', '630px'); // if the user hasn't reached to the end of sidebar or he scrolled back, this is the default width value.
       }
   });
    }
});