1

Тема: Расширение страницы при прокрутке

Привет. Подскажите как можно реализовать расширение страницы при её прокрутке, как на сайте VK.com ?

Поделиться

2

Re: Расширение страницы при прокрутке

при сближении к концу страницы - посылать ajax запрос - который вернет html и вставить его на страницу.

Site | GitHub | Создание форумов/решений на базе PunBB/Monstra/OGMA

Плагины распространяются по Creative Commons Attribution-NonCommercial 3.0

Сайт KANekT

Поделиться

3

Re: Расширение страницы при прокрутке

Jquery, настал твое время.

Изменение при прокрутке больше кол-ва пикс от верха страницы

scrollStart = 900; // Начало расширения страницы начинается, когда прокрутка доходит вниз до 900 пикселов
$(window).scroll(function(){ 
    
    var scroll = $(window).scrollTop();
     $('body').html()
     
     if (scroll > scrollStart) {
            $('#ЭЛЕМЕНТ').css('width','960'); // задаем нужную ширину элементу при прокрутке больше 900 пикс
      } else {
            $('#ЭЛЕМЕНТ').css('width','450'); // задаем ширину, которая должна быть при прокрутке менее 900 пикс
      }
 });

Если нужно, чтобы изменения происходили при прокрутке до определенного элемента, то вот еще код

scrollStart = $('#ЭЛЕМЕНТ-ПОСЛЕ-КОТОРОГО-ИЗМЕНЕНИЯ').offset().top;// Начало расширения страницы начинается, когда прокрутка доходит вниз до 900 пикселов
$(window).scroll(function(){ 
    
    var scroll = $(window).scrollTop();
     $('body').html()
     
     if (scroll > scrollStart) {
            $('#ЭЛЕМЕНТ').css('width','960'); // задаем нужную ширину элементу при прокрутке больше 900 пикс
      } else {
            $('#ЭЛЕМЕНТ').css('width','450'); // задаем ширину, которая должна быть при прокрутке менее 900 пикс
      }
 });

Поделиться

4

Re: Расширение страницы при прокрутке

Второй код - коммент "Начало расширения страницы начинается, когда прокрутка доходит вниз до 900 пикселов" не относится к коду.

Поделиться

5

Re: Расширение страницы при прокрутке

KANekT пишет:

при сближении к концу страницы - посылать ajax запрос - который вернет html и вставить его на страницу.

Зачем такой гемор?)

Поделиться

6

Re: Расширение страницы при прокрутке

Ааа, понял.
Пожалуйста, уточни вопрос, что ты хочешь конкретнее. Добавление контента или расширение блока?)

Поделиться

7

Re: Расширение страницы при прокрутке

Илья пишет:

Ааа, понял.
Пожалуйста, уточни вопрос, что ты хочешь конкретнее. Добавление контента или расширение блока?)

Спасибо за подробный ответ. Просто расширение блока. Вот как это реализовано на сайте VK.com

В начале страницы ширина 631 px

http://f4.s.qip.ru/~uX0nxY0S.png

После скролла вниз стало 646 px

http://f3.s.qip.ru/~uX0nxY0T.png

Вот такая задача smile

Поделиться

8

Re: Расширение страницы при прокрутке

Разве это не то, о чем я написал?
"$('#ЭЛЕМЕНТ').css('width','450')" - в начале страницы
"$('#ЭЛЕМЕНТ').css('width','960');" - после скрола вниз

Поделиться

9

Re: Расширение страницы при прокрутке

Илья пишет:

Разве это не то, о чем я написал?
"$('#ЭЛЕМЕНТ').css('width','450')" - в начале страницы
"$('#ЭЛЕМЕНТ').css('width','960');" - после скрола вниз

Спасибо.

Поделиться

10

Re: Расширение страницы при прокрутке

Иногда смотришь и думаешь... под чем я тогда был... надеюсь ты разобрался))

Поделиться