Показать сообщение отдельно
  #1 (permalink)  
Старый 30.04.2016, 14:57
Новичок на форуме
Отправить личное сообщение для Schwab Посмотреть профиль Найти все сообщения от Schwab
 
Регистрация: 30.04.2016
Сообщений: 2

Поведение "плавающей" боковой колонки при изменении размеров окна браузера
Здравствуйте, помогите разобраться и решить следующую проблему.
Реализовываю фиксацию боковой колонки на сайте при помощи следующего кода:
var rightcolumnTop = rightcolumn.offset().top;
var columnPosition = contentWidth - rightcolumnWidth + contentLeftMargin;
var rightcolumnStop = headerHeight + popularPostHeight + contentHeight - rightcolumnHeight;
var columnPositionDown = contentWidth - rightcolumnWidth;
$(window).scroll(function(){
   if ( $(this).scrollTop() > rightcolumnTop ) 
      {
        rightcolumn.addClass("columnfixed");
        rightcolumn.css({"top":"0px", "left": columnPosition - 2 +"px", "width": rightcolumnWidth+"px", });
       }
   if($(this).scrollTop() >= rightcolumnStop && rightcolumn.hasClass("columnfixed"))
       {   
          rightcolumn.removeClass("columnfixed");
          rightcolumn.addClass("columnabsolute");
          rightcolumn.css({"top": contentHeight - rightcolumnHeight+"px", "left": columnPositionDown - 2 +"px", "width": rightcolumnWidth+"px", });  
        }
   if($(this).scrollTop() < rightcolumnStop && rightcolumn.hasClass("columnabsolute"))
        {
           rightcolumn.removeClass("columnabsolute");
           rightcolumn.addClass("columnfixed");
           rightcolumn.css({"top":"0px", "left": columnPosition - 2 +"px", "width": rightcolumnWidth+"px", });
         }
                 
      if($(this).scrollTop() <= rightcolumnTop && rightcolumn.hasClass("columnfixed"))
         {
             rightcolumn.removeClass("columnfixed");
          }
});


Наверно идея очень не верно реализована (хоть и получается закрепить колонку когда нужно), но при изменении размеров окна браузера, колонка остаётся на том месте, которое на данный момент было определено в стилях. И проблема решается только при обновлении страницы.
Подскажите как правильно реализовать фиксацию и открепление колонки, чтобы не возникало таких проблем.
Ответить с цитированием