Используйте jQuery set .css RIGHT, если #foo + offset left больше ширины страницы

Question

Хорошо, поэтому я пытаюсь использовать jQuery для получения innerWidth() элемента #preview.Я хочу создать условное выражение, в котором указано, ЕСЛИ x смещение LEFT + #preview ширина больше ширины страницы, задайте ему стиль right: z, где z = #preview width + xOffset.

Я извиняюсь, мой код нижебеспорядок и синтаксис для .css ("right", (rightFloat + xOffset) + "px") (строка 125) отключен, но это часть моей проблемы.

<script>

    $(document).ready(function(){

    //append "gallery" class to all items with "popup" class
    imagePreview();
    $(".popup").addClass("gallery");
});    

//The overlay or pop-up effect
this.imagePreview = function() { /* CONFIG */

    xOffset = 40;
    yOffset = 40;

    // these 2 variable determine popup's distance from the cursor
    // you might want to adjust to get the right result
    /* END CONFIG */
    $("a.preview").click(function(e) {
        return false;
    });
    $("a.preview").hover(function(e) {
        this.t = this.title;
        this.title = "";
        var c = (this.t != "") ? "<br/>" + this.t : "";
        var rightFloat = e.pageX + ("#preview").innerWidth;
        $("body").append("<p id='preview'><img src='" + this.href + "' alt='Image preview' />" + c + "</p>");
        $("#preview").hide().css("top", (e.pageY - yOffset) + "px").css("left", (e.pageX + xOffset) + "px").fadeIn("2000");
        while ((left + 400) > window.innerWidth) {.css("right", (rightFloat + xOffset) + "px")
        }
    }, function() {
        this.title = this.t;
        $("#preview").remove();
    });
    $("a.preview").mousemove(function(e) {
        var top = e.pageY - yOffset;
        var left = e.pageX + xOffset;
        var rightFloat = e.pageX + ("#preview").innerWidth;
        //flips the image if it gets too close to the right side
        while ((left + 400) > window.innerWidth) {.css("right", +(rightFlaot + xOffset) + "px")
        }
        $("#preview").css("top", top + "px").css("left", left + "px");
    });
};


</script>

Answer 1

Попробуйте использовать http://api.jquery.com/offset/

if($('#preview').offset().right<0){
   var right = parseInt($(window).width()) - e.pageX + xOffset;
   $("#preview").css("top", top + "px").css("right", right + "px");
}else{
   var left = e.pageX + xOffset;
   $("#preview").css("top", top + "px").css("left", left + "px");
}

Я сделал эти исправления, потому что не смог заставить ваш код работать в jsfiddle: var xOffset = 40; var yOffset = 40; $ ( "A.preview"). Bind ( 'Mouseover', функция (е) { var rightFloat = parseFloat (e.pageX) + $ ("# preview"). innerWidth ();
var ptop = parseFloat (e.pageY) - yOffset; var pleft = parseFloat (e.pageX) + xOffset; $ ("# preview"). css ({"top": ptop + "px", "left": pleft + "px"}); });

Есть исправления для верхней половины, но я понятия не имею, что вы пытаетесь сделать с нижней частью (с циклом while). Можете ли вы объяснить, какую функциональность вы хотите?