Прыгает изображение из за скрипта?

Question

[viktorulyushev]

В общем нужно было добавить изображение по бокам контейнера,добавил так,добавил класс по бокам и прописал стили

.background-layout:before {
    content: '';
   background-image: url(/Templates/Moloko/images/banner-left.png);
    position: absolute;
    left: 52px;
    top: 252px;
    width: 108px;
    background-size: 100px;
    height: 529px;
    background-repeat: no-repeat;
}

Все нормально,но появилась проблема,когда листаешь страницу вниз то у шапки изменяется высота скриптом,сделана как прилипайка,из за этого начинает прыгать мое изображение,если вынести за контейнер мои классы,то отступы будут не от контейнера,и будут при изменении разрешения экрана уезжать в бока,как можно поступить?

Answer 1

[viktorulyushev]

Вот сайт zipinsk.ru там можете увидеть мои классы и при растягивании экрана они уезжают,я уж через медиа запросы сделал,но это все равно не то
Можно ли сделать как то чтобы отступ был от определенного класса, который я укажу?

Вот js который меняет высоту

$(function () {
    var siteheadHeight;
    var menublockHeight;
    $(window).load(function () {
        siteheadHeight = $(".site-head").height();
        menublockHeight = $(".menu-block").height();
    });
    $(window).scroll(function () {
        if ($(window).scrollTop() > siteheadHeight) {
            $(".site-head").css('height', siteheadHeight + menublockHeight);
            $(".menu-block").addClass("stick");
        } else {
            $(".site-head").css('height', siteheadHeight);
            $(".menu-block").removeClass("stick");
        }
    });
    $('.products-view-item').on("click", function (event) {
        event.stopPropagation();
        var target = $(event.target);
        if (target.closest(".compare-control").length > 0 || target.closest(".products-view-buy").length > 0 || target.closest(".products-view-photos-image").length > 0) {
            return;
        }
        if ($(this).data('hreff')) window.location = $(this).data('hreff');
    });

});

Answer 2

[Егор Живагин]

Непонятно ж ничего. Пример на codepen бы

Comments

[viktorulyushev]

а что я на codepen залью?весь сайт?и что не понятно?

[viktorulyushev]

Вот сайт zipinsk.ru

[Ярослав Иванов]

viktorulyushev: Ничего не понятно.

[Егор Живагин]

viktorulyushev: кручу-верчу сайт... у меня ничего не прыгает, всё норм.
Только в консоли можно найти $ is undefined

[viktorulyushev]

Егор Живагин: не прыгает потому что я вынес мои блоки за контейнер,я же писал,а если поместить их в контейнер то отступы будут от него ,как мне и надо,но при скроле будет прыгать потому что site-head будет добавляться высота

[Interface]

Задайте вопрос в общем виде. Залейте нужный кусок (тот работа которого воспроизводится и вам не нравится) на codepen или в другую песочницу. Желающих разобраться в вашей проблеме прибавится. Потому что:
- мало кто заинтересован просто делать за вас работу;
- вопрос в обобщенной форме будет полезен кому-то кроме вас.

Более того, велика вероятность, того, что в процессе абстрагирования от вашего конкретного случая, вы все сами решите. Тогда, впрочем, также имеет смысл зайти сюда снова и написать в чем была проблема и как вы ее решили. Опять таки, лучше ответ также писать в общем виде.

[viktorulyushev]

Interface: В песочницу я не заливал потому что это будет очень муторно и долго,там и скрипты работают и структуру надо всю,а вопрос то простой.Решил так,вынес добавленные классы за пределы контейнера в котором скрипт меняет высоту,и он не будет влиять на мои классы,а позиционирование решил медиа запросами