картинка во весь экран
#about_us_logo { background: url(img/about_logo.jpg); background-repeat: no-repeat; -o-background-size: 100% 100%, auto; -moz-background-size: 100% 100%, auto; -webkit-background-size: 100% 100%, auto; background-size: 100% 100%, auto; } <div id="about_us_logo"></div> Все хорошо как-бы, но как сделать чтоб при уменьшение экрана эта картинка которая на весь экран не уродовалась сжимаясь, а прятала свои края и оставалась всегда по центру(то есть overflow:hidden той части которая не попадает во весь экран) нашел пример http://jsfiddle.net/LSKRy/654/ тут реализовано все так как мне нужно, при уменьшение картинка обрезается и всегда остается по центру, вопрос можно ли такое реализовать на одном <div id="about_us_logo"></div> без этих right: -50%; / left: -50%; div блогов как на образце. |
|
спасиб, но нужно этот resize чтоб работал именно на этой структуре <div id="about_us_logo"></div> без добавления картинки так таковой во внутрь контейнера, просто внутри блока у меня куча других блогов со своей информацией которая отображается на full width картинке, не могу я туда добавлять <img ....> куча всего разлетается тогда сразу.
глупо наверное будет данную штуку $(window).load(function () { $("img").fullCenter() }); $(window).resize(function () { $("img").fullCenter() }); вешать на мой div, ибо там уже наверное бред будет если он к divu будет добавлять свои .......... width: a / b * c, height: a, left: -(a / b * c - f) / 2, top: -(a - e) / 2 ......... |
cha0s,
background: url(img/about_logo.jpg) 50% 50%; background-repeat: no-repeat; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; background-size: cover; |
воо так и думал что должно быть что-то на css! отлично работает! спасибо как обычно тебе :thanks:
|
Часовой пояс GMT +3, время: 20:01. |