Отрицательное абсолютное позиционирование, удаление полосы прокрутки

Я работаю над этим сайтом: http://waterwing.waterwing.ca/

Анимация в правом верхнем углу идеальна, за исключением того, что она создает горизонтальную полосу прокрутки в зависимости от того, как она расположена.

Он абсолютно расположен на -120 пикселей сверху и справа. Мне просто интересно, как я могу сделать так, чтобы он не расширял тело и просто скрывался, когда доходил до края страницы, чтобы не было полосы прокрутки.

Кажется, что полосы прокрутки нет в Windows Firefox, но она есть в Mac Firefox и Safari.

Спасибо, Уэйд.


css css-position overflow
person Wade D Ouellet    schedule 18.12.2009    source источник

Ответы (3)


arrow_upward
6
arrow_downward

оберните #corner в другой div и установите для него размер, занимаемый конечной точкой анимации, а также абсолютную позицию. установите для этого div скрытое переполнение, чтобы оно не вытекало из страницы и не запускало прокрутку.

person prodigitalson    schedule 18.12.2009
comment
Ага. Скрытый перелив - это то, что вам нужно. - person Azeem.Butt; 18.12.2009
comment
Отлично, div был слишком большим для разрешения 1024, поэтому мне пришлось начать с меньшего размера, а затем увеличивать его с помощью jquery при наведении курсора. Я думаю, что теперь все идеально, еще раз спасибо! - person Wade D Ouellet; 18.12.2009

arrow_upward
2
arrow_downward

Вы также можете просто поместить overflow: hidden на тело, работает так же и сохраняет вам div

person Austin    schedule 02.12.2011

arrow_upward
-1
arrow_downward

В зависимости от вашей ситуации, вы можете получить полосы прокрутки для div или для всей страницы. При создании адаптивного макета веб-сайта я всегда пишу этот CSS:

body {
    overflow-x: hidden;
}

И это предотвращает появление полос прокрутки, кросс-браузерность и кросс-девайс.

person James    schedule 21.06.2014