Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.04.2013, 01:14
Аватар для utb
utb utb вне форума
Аспирант
Отправить личное сообщение для utb Посмотреть профиль Найти все сообщения от utb
 
Регистрация: 26.10.2011
Сообщений: 94

Динамическое изменение ширины контента
Здравствуйте,
объясните в каком направлении двигаться:

Надо сделать как в контакте: на странице пользователя при прокрутке правый сайдбар как бы заканчивается и контент занимает всю ширину.

я так понимаю: при скроллинге до окончания блока (сайдбара) мы меняем классы у блоков ?

Может есть примеры или готовые решения?
просто я как то даже не знаю как это правильно называется

Заранее спасибо
Ответить с цитированием
  #2 (permalink)  
Старый 17.04.2013, 05:16
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Слушаем событие window:scroll. По событию проверяем scrollY (или лучше pageYOffset). В старых IE с этим косяк, нужно воркэраундить. Если scrollY > высота_сайдбара , то растягиваем контент. Другой вариант все по тому же событию получать сайдбар.getBoundingClientRect() , через что можно узнать, находится ли в видимой области сайдбар.
Ответить с цитированием
  #3 (permalink)  
Старый 17.04.2013, 10:07
Аватар для utb
utb utb вне форума
Аспирант
Отправить личное сообщение для utb Посмотреть профиль Найти все сообщения от utb
 
Регистрация: 26.10.2011
Сообщений: 94

danik.js,
большое спасибо, но я как-то по js не очень
на Jquery такое можно?
я так понял if скрол > например 200, то addclass (класс)
что такое?

Заранее спасибо
Ответить с цитированием
  #4 (permalink)  
Старый 17.04.2013, 14:36
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от utb
что такое?
Что что такое?
Сообщение от utb
на Jquery такое можно?
Ага, так даже проще все.
Ответить с цитированием
  #5 (permalink)  
Старый 17.04.2013, 16:35
Аватар для utb
utb utb вне форума
Аспирант
Отправить личное сообщение для utb Посмотреть профиль Найти все сообщения от utb
 
Регистрация: 26.10.2011
Сообщений: 94

danik.js,
спасибо, буду думать.
Цитата:
Что что такое?
это типа: что нибудь такое? - по той логике, что описал.
Ответить с цитированием
  #6 (permalink)  
Старый 17.04.2013, 19:31
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

$(window).scroll(function(){
    $content.toggleClass('wide', $(this).scrollTop > 200);
});
Ответить с цитированием
  #7 (permalink)  
Старый 18.04.2013, 16:25
Аватар для utb
utb utb вне форума
Аспирант
Отправить личное сообщение для utb Посмотреть профиль Найти все сообщения от utb
 
Регистрация: 26.10.2011
Сообщений: 94

у меня чего то не получается(
$(window).scroll(function(){
   ('.special').toggleClass('wide', $(this).scrollTop > 200);
});

что то не получается. Что я делаю не так?
Ответить с цитированием
  #8 (permalink)  
Старый 18.04.2013, 17:08
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

$(this).scrollTop()
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическое изменение ширины в зависимости от содержимого iNfantry Events/DOM/Window 38 24.07.2017 20:38
Динамическое изменение фона ячейки CyMKuH Элементы интерфейса 2 11.07.2011 15:19
Динамическое изменение контента со скроллом Accessd Элементы интерфейса 0 03.10.2009 17:34
Динамическое изменение <input text> baal1988 Events/DOM/Window 4 24.08.2008 17:17
Динамическое изменение размеров изображения Макс Элементы интерфейса 7 21.07.2008 16:55