2013-12-02 6 views
0

Мне было интересно, как этот трюк достигается на http://www.vaexu.com/amada.jQuery используется для заполнения окна браузера независимо от размера

У них есть начальный полный экран изображения независимо от размера окна браузера. Я попытался перепроектировать его, чтобы посмотреть, что используется jQuery (что я ожидаю, используется). Я знаю о backstretch, но как полный экран div принудительно?

Кто-нибудь сделал эту технику раньше? Какие способы достижения этого?

Заранее спасибо.

ответ

1

ну, они, кажется, используют бутстрап для всего визуального оформления прокрутки (и это происходит вверх и т. Д.). Но чтобы сделать изображение на 100%, сделайте следующее: html;

<body> 
    <div> 
     </img> 
    </div> 
    ... 

css;

html,body{width:100%;height:100%;} 
div{ 
    position:relative; 
    height:100%; 
    width:100%; 
} 
img{ 
    min-height:100%; 
    min-width:100%; 
} 
+0

именно то, что я искал ... по какой-то причине я ожидал, что это будет сложнее. – memyselfandmyiphone

+0

круто, я смог помочь! :) – japrescott

0

Есть несколько методов, используемых здесь:

  1. Контейнер DIV (v-заголовок-топ) устанавливается на 100% (это будет взять на себя всю ширину своего родителя)
  2. клиновые -header-top div имеет фоновое изображение, которое применяется к нему, а также имеет атрибут фонового размера, установленный для покрытия (размер фона: обложка).

В результате фоновое изображение масштабируется до размера его контейнер.

Смежные вопросы