HTML фон и фиксированной CSS--

Эффект:

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

 

Методы:

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

HTML

< Тело > 
    < IMG класс = "backImg" SRC = "IMG / backimg.png" > 
    < DIV ID = "контейнер" > 
    </ DIV > 
</ тело >

CSS

Тело { 
    Запас : 0px ; 
    мин-ширина : 1920px ; 
    мин-высота : 800px ; 
    переполнение : скрытый ;
}

.backImg { 
    ширина : 1530px ; 
    позиция : абсолютная ; 
    право : 0 ; 
    сверху : 0 ;
}

#container { 
    позиция :  фиксированная ; 
　　 Дно :  250px ;  
　　 ширина : 383px ; 
    Дисплей : сгибать ; 
    Flex-направление : колонка ; 
    обосновывать-содержание : центр ; 
    Левое поле : 131px ;
}

JS

window.onload = функция () {
     если ($ (окно) .width () <= 1660 ) {
        $ ( '.BackImg ') атр. (' Стиль', 'слева: 150px;' );
    }
}
$ (окно) .resize ( функция () {
     если ($ (окно) .width () <= 1660 ) {
        $ ( '.BackImg ') атр. (' Стиль', 'слева: 150px;' );
    }
    еще {
        $ ( '.BackImg ') removeAttr (' стиль'. );
    }
})