Адаптивная анимация, картинок?

Question

[onahapa]

Всем привет.
Есть картинка в слайдере bootstrap(как вы знаете при различных размерах браузера, картинка будет подстраиваться), на нее накладываются две картинки(position: absolute). Я ручками их подогнал(left, top) и вроде бы все ничего, да вот при изменении размера окна браузера, картинки уезжают. Не беда делаю все через - media, но это очень запарно и наверняка есть какой-нибудь добротный вариант. Прошу помощи в его поиске.
При наведении вызывается анимация и текст("Октябрь") мерцает. Дело в том, что это не единственная анимация в этом блоке, будут наложены еще несколько картинок, которые будут активироваться при наведении, а при наведении на часы, происходит одна больная анимация, которая объединяет все элементы в блоке.

Answer 1

[Андрей Б.]

Самый простой способ - объединить изображения.

Comments

[onahapa]

Я сделал так: удалил одно из накладываемых изображений и получил два, фоновое и накладное, но получается все так же. Может Вы имели ввиду,что то другое?

[Андрей Б.]

Я имел ввиду сделать одно изображение. Зачем париться если никаких манимуляций с ним не проводится. Как мне кажется. Для чего вы накладываете его поверх, по ховеру или что? Понятно что нужна "рамка для здания", но зачем накладывать поверх если нет никаких действий при этом? Слейте слои в фотошопе и не парьтесь.

[onahapa]

Андрей Б.: Точно, я забыл описать, что именно я делаю с этой картинкой. При наведении вызывается анимация и текст("Октябрь") мерцает. Дело в том, что это не единственная анимация в этом блоке, будут наложены еще несколько картинок, которые будут активироваться при наведении, а при наведении на часы, происходит одна больная анимация, которая объединяет все элементы в блоке. Спасибо за замечание =).

[Андрей Б.]

В таком случае лучше предоставить код и выложить его например сюда jsfiddle.net, будет время гляну

[onahapa]

Андрей Б.: jsfiddle.net/n9mjdmn3/2

[Александр Гамов]

onahapa: Уберите лишние из примера. Код очень загроможден, дольше разбираться где что и зачем, чем решать проблему ) А в идеале упростите до А и Б, на примере двух произвольных картинок.

[Андрей Б.]

onahapa Ну вы конечно отмочили. Нафига бросать весь html и css, нельзя было выложить только нужную часть? Не стал копаться, сделал пример того что вам нужно - jsfiddle.net/8hnrxe3w

[Андрей Б.]

Все дело в max-width

[onahapa]

Александр Гамов: Андрей Б.: я же написал, что присутствует бутстрап, поэтому пришлось выложить стили его, и опять же я их отделил комментариями..

[Андрей Б.]

onahapa Будь по вашему. В итоге то что, решение помогло?

[onahapa]

Андрей Б.: Спасибо. =)

Answer 2

[Valery]

Попробуйте задать размеры накладываемого блока в процентах. И позиционирование через top и left тоже сделать в процентах

Comments

[onahapa]

именно так я и делаю=)