我在放置弹出窗口时遇到问题 <div>
在窗口中央使用:
var popup = $("#popup"), popupWidth = popup.css("width").replace("px",""), popupHeight = popup.css("height").replace("px","");
var xPosition = ($(window).width() - popupWidth) / 2;
var yPosition = (($(window).height() - popupHeight) / 2) + $(window).scrollTop();
if (yPosition <= 0){
yPosition = '0';
} else if(yPosition <= $(window).scrollTop()){
yPosition = $(window).scrollTop();
} else {
yPosition = yPosition - 68; //minus top shaddow height
}
if (xPosition >= $('body').offset().left) {
xPosition = xPosition;
} else {
xPosition = '0';
}
$(popup).css({
'top': yPosition + 'px',
'left': xPosition + 'px',
'display' : 'block',
'height' : 'auto'
}).addClass("popup-open");
我遇到的问题是,第一次加载时,弹出窗口的高度返回为 0,因为它是隐藏的,直到计算出上面的位置之后。为了解决这个问题,我通过 CSS 设置了默认高度,然后一旦显示弹出窗口,我将其覆盖为 auto。
现在的问题是,如果弹出窗口已关闭并重新打开,则高度为自动。有没有办法在样式表中找到 CSS height:value 而不是内联 height:auto
更新代码 以下尼古拉的回答是固定代码:
var popup = $("#popup"), popupWidth = popup.css("width").replace("px",""), popupHeight = popup.css("height").replace("px","");
// Save/Get original height
if(popupHeight == "auto"){
popupHeight = popup.data('origHeight');
} else {
popup.data('origHeight', popupHeight);
}
var xPosition = ($(window).width() - popupWidth) / 2;
var yPosition = (($(window).height() - popupHeight) / 2) + $(window).scrollTop();
最佳答案
为什么不将原始值保存在变量中?
var popup = $("#popup"), popupWidth = popup.css("width").replace("px",""), popupHeight = popup.css("height").replace("px","");
var originalHeight = popupHeight;
var originalWidth = popupWidth;
当您重新打开弹出窗口时,您将使用原始值而不是实际值
或者你可以使用data()存储并检索它
$('#popup').data('origHeight', popupHeight);
//the use $('#popup').data('origHeight') to retrieve it
关于javascript - 计算高度的弹出窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6641060/