jquery - 在 Optimizely 中隐藏附加的 div

Question

在下面的代码中，我无法在用户到达最后一段之前隐藏附加的 div。div 在页面加载时显示正确，我想让它仅在用户到达“最后一个”ID 时显示。

$('body').append('<div id="optslidebox"></div>');

$(".slide-content > p").attr("id", "last");

window.scrollBox = function () {
    $(window).scroll(function () {
        /* when reaching the element with id "last" we want to show 
        the slidebox. Let's get the distance from the top to the element */
        var distanceTop = window.$('#last').offset().top - window.$(window).height();

        if (window.$(window).scrollTop() > distanceTop) {
            window.$('#optslidebox').animate({'right': '0px'}, 300);
        } else {
            window.$('#optslidebox').stop(true).animate({'right': '-430px'}, 100);
        }
    });

    /* remove the slidebox when clicking the cross */
    $('#optslidebox.close').bind('click', function () {
        $(this).parent().remove();
    });
};

Answer 1

Issue came from the variation code. "Right" was set to "0px" - once this was changed to "-999px" all was good. Here's the final variation code:

    window.scrollBox();
    $("#related-posts").css({"z-index":"1"});
    $("#optslidebox").replaceWith("<div id=\"optslidebox\" style=\"z-index:2; right: -999px;\">\n\t<a class=\"close\"></a>\n\t<p>Recommended</p>\n\t<h2>WHO ARE YOUR FAVORITE RAPPERS' FAVORITE RAPPERS RIGHT NOW?</h2>\n</div>");
    $("#optslidebox > h2").wrapInner("<a href=\"http://greenlabel.com/sound/rappers-who-skate-skaters-who-rap/\"></a>");