jQuery scrollTo не работает тело, HTML установить 100% - PullRequest
1 голос
/ 21 февраля 2011

Только что получил отличную помощь от SO-пользователя по этому вопросу:

jПросьба к прокрутке окна анимации положения фонового изображения

Как вы можете видеть здесь, я хотел постепенно прокручивать фоновое изображение divs, когда пользователь прокручивает страницу. Смотрите это для рабочей версии:

http://jsfiddle.net/nicklansdell/HFxVj/4/

Данный ответ работает отлично. Однако, помимо возможности прокрутки страницы с помощью полосы прокрутки в браузерах, я также хочу включить некоторые дополнительные функции, которые прокручивают страницу до позиции хеша divs при нажатии на якорь (и). Я использую плагин scrollTo для достижения этой цели, которая прекрасно работала, пока я не включил следующий CSS:

body, html {
    height: 100%;
    min-height: 100%;
}

К сожалению, если я включу это, анимация страницы scrollTo не будет работать, но, в том числе, она позволяет анимации положения фонового изображения работать, она, кажется, одна или другая, но, конечно, мне нужны обе :-) Может кто-нибудь предложить Обходной путь здесь? Большое спасибо заранее.

EDIT *

Я немного сузил свою проблему. Проблема не связана с телом, html установлен на высоту 100%. Это сводится к тому, чтобы дать #page div физическую высоту. Для прокрутки фонового изображения требуется высота 100%, но не требуется указывать высоту для работы scrollTo. Посмотрите мое обновление JSFiddle http://jsfiddle.net/nicklansdell/HFxVj/4/ и поэкспериментируйте со стилем #page, чтобы понять, что я имею в виду.

Ответы [ 3 ]

1 голос
/ 16 марта 2011

Используете ли вы $.scrollTo('selector-for-target-element', time); для выполнения прокрутки? для этого синтаксиса любой из HTML тела должен иметь высоту auto. У меня была похожая проблема, и я решил, явно указав родительский div, который нужно прокрутить.

$('parent-div-selector').scrollTo('selector-for-target-element', time);
instead of 
$.scrollTo('selector-for-target-element', time);

и это сработало.

Надеюсь, это поможет.

0 голосов
/ 09 июля 2016

Применяйте только высоту к телу, а не html.

0 голосов
/ 21 февраля 2011

Просто длинный снимок - пытались ли вы применить CSS к телу или HTML вместо них обоих?

только тело:

body { 
height: 100%;
min-height: 100%;
}

только html:

html { 
height: 100%;
min-height: 100%;
}
...