Такова се ля ви. Вы же не удивляетесь (или удивляетесь?), что вам нужно прописывать разные цвета текста (черный\белый как минимум) в css для разных картинок? Прописывать background-color - в любом случае хорошая практика, страница не так "моргает" в процессе загрузки изображений.
Правильное решение подсказала @Libris - background-position + background-repeat.
Всплытие события - это одно дело. Смысл его в том, что событие поочерёдно "выстреливает" на DOM-предках, поднимаясь вверх. Оно действительно останавливается e.stopPropagation(). Но если его специально на этих предках не ловить - оно вообще никак себя не проявляет. Скажем, вы вешаете обработчик на кнопку и ловите там событие click. После этого оно само ещё раз "выстрелит" на body (если не сделать e.stopPropagation() ). Но вас это не должно волновать до тех пор пока на body не будет повешен свой собственный обработчик click.
У вас же другой случай. Вы внутри обработчика, повешенного на wrapper, самостоятельно вручную поднимаетесь к предкам в цикле while. Это не всплытие события, а ваш код, ручной траверс, @Petroveg вам про это написал. Просто из кода не ясно зачем вы это делаете. Может просто убрать цикл? Зачем он вам?
@Jovli delta подбирается по обстоятельствам. Это минимум 1, чтобы исключить проблемы с нецелыми координатами в процессе анимации. Так же, delta может быть равна средней от размеров проверяемых объектов - тогда коллизия будет считаться не только при пересечении центров объектов, но и при их частичном пересечении.
Кроме того, delta должна быть увеличена на шаг анимации. Если анимация быстрая, то, скажем, в предыдущем кадре первый объект имел х=100, а в текущем уже х=200. Второй объект наоборот был x=200, стал x=100. По логике должна была бы произойти коллизия. Но из-за грубого шага анимации они "пролетели" сквозь друг-друга. Чтобы такого не происходило, нужно поднимать значение delta до 100. Но важно не переборщить. Это стандартная борьба бобра с ослом: точность в пространстве vs скорость движения.
@iiil .offset() за раз получает из DOM значения top и left и пишет их в объект типа {top: 12, left: 34}. Потом обращаться к свойствам этого объекта дешево.
А ещё в Chrome -> F12 -> Sources есть чекбокс Pause On Caught Exceptions - очень удобно. Он как раз останавливает на той строке, где сейчас "всё сломается", показывая весь стек вызовов и значения переменных в этот момент времени. Удачи!
@iiil Кстати, проверять вторые координаты (если первые не совпадают) не нужно в случае любого движения, не только строго вертикального. ;) Но оно так и работает по идее - ленивый && в условии не будет проверять второй операнд, если первый false.
Только непонятно, что же товарищу именно надо, contain или cover, он сам себе противоречит: "картинка не должна выходить за пределы экрана", но "бока обрезать".
@amalchikov Положите в эту пустую ячейку div с hslide, дайте этому div'у отрицательный z-index и отрицательные margin, чтобы он "заходил за края". В остальные ячейки контейнер с position: relative и положительный z-index.
@amalchikov ну так вот и ответ в таком случае: evraz.com, делайте как там.
Вы пишете, например: "чтобы 2 слоя были друг над другом" даже непонятно о чём вы - выше по z-index или по height. Напишите нормально вопрос, развёрнуто, с примерами и иллюстрациями. Перечитайте и убедитесь что вопрос понятен с первого раза, полон и не требует пояснений. Иначе не ждите, что вам нормально ответят - экстрасенсов тут нет.
@lamo4ok C бутстрапом действительно не флоатится нармально, я проверил. А был уверен, что оно работает как нужно (вообще оно работает, но только если большой блок идет первым).
С флеексом как именно быть не подскажу - сам стараюсь его избегать, боюсь немного. :) Но знаю что можно, видел примеры.
@iiil Про работу с кривыми это точно, действительно там удобнее если набита рука.
Но главное что корел - это тупиковая ветвь эволюции (экосистема Adobe CS - монопольный стандарт в индустрии, дело даже не в ill, ну вы понимаете). Зачем учиться "играть неправильно", чтобы потом переучиваться?
По моим ощущениям плюсы люстры перевешивают плюсы корела в раз сто.
Это вроде как Delphi - кому-то по привычке может что-то и удобнее в нем делать. Но учить его сейчас и привыкать к нему - крайне сомнительная трата времени. Dive into Illustrator!
@lexxpavlov Ничуть не умаляя вашего ответа - там всё по делу. Хочу заметить, что Google, таки, индексирует javascript. Но как-то странно и не сразу. Я проверял. Сначала вроде бы убедился что не индексируются, а потом спустя месяц полез за пруфом и удивился.