CODEWITHSUNDEEP
jquerypopupheight
user3304232
user3304232

Reputation: 97

get height of jQuery popup when it shows up

I want to geht the height of a popup when it is loaded so that I can set the left/top value and make sure it is not out of the viewport. But at the first time the popup is toggled, there's only the hight of the static div available, not including the content from ajax.


$(".td_id").click(function(e) {
    var leftVal = e.pageX+10;
    var topVal  = e.pageY;
    var bodyTop = document.documentElement.scrollTop;
    topVal     -= bodyTop;
    win         = $(window).height();
    winCenter   = win / 2;
    $.post("ajax.php",{do:'load_data'},function(table){
                            $(".popup tbody").html(table);
                        }
    );
    $(".popup").toggle();
    popup = $(".popup").height();
    if (topVal > winCenter) topVal -= popup;
    if ((topVal+popup) > (win + 10)) topVal = win-10-popup;
    if (topVal < 10) topVal = 10;
    $(".popup").css({left:leftVal,top:topVal});
});




So how to get the height after the content is received and added to the popup div?

Upvotes: 0

Views: 931

Answers (1)

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

The popup seems to be getting content from ajax post, and as you are trying to calculate height outside the post callback (before popup gets its content from ajax post), hence the height is not calculated proper. Try replacing your height calculation code inside Ajax Post success callback function, as:

...
$.post("ajax.php",{do:'load_data'},function(table){
    $(".popup tbody").html(table);

    $(".popup").toggle();
    popup = $(".popup").height();
    if (topVal > winCenter) topVal -= popup;
    if ((topVal+popup) > (win + 10)) topVal = win-10-popup;
    if (topVal < 10) topVal = 10;
    $(".popup").css({left:leftVal,top:topVal});
});
...

Upvotes: 1

Related Questions