Question

我希望有人可以提供帮助，因为我目前很难过。我正在使用speedo弹出窗口显示弹出窗口，但我希望它始终显示在屏幕的右下角。我发现（感谢比我更聪明的人）代码来识别某人浏览器的像素并且我已经计算了，我需要减去多少像素才能使弹出窗口正确显示并为其计算变量但现在我需要写入speedo弹出功能的变量，以便弹出正确的位置。

我需要将“h”和“w”变量的值放在下面的函数语句中“top：”和“left：”部分的右边。

我希望这是有道理的。任何帮助表示赞赏。谢谢

代码如下：

<script type="text/javascript">
// JavaScript
function jsUpdateSize(){
    // Get the dimensions of the viewport
    var width = window.innerWidth ||
        document.documentElement.clientWidth ||
        document.body.clientWidth;
    var height = window.innerHeight ||
        document.documentElement.clientHeight ||
        document.body.clientHeight;

    document.getElementById('jsWidth').innerHTML = width;
    document.getElementById('jsHeight').innerHTML = height;

    var w;
    var h;
    w=width-580;
    h=height-270;
    document.getElementById('w1').innerHTML = w;
    document.getElementById('h1').innerHTML = h;
};

window.onload = jsUpdateSize;       // When the page first loads
window.onresize = jsUpdateSize;     // When the browser changes size

$(function () {
    $.fn.speedoPopup({
        //htmlContent: "",
        theme: "metro",
        width:500,
        height:200,
        href: "http://delanceyplace.com/subscribe_iframe.php",
        autoShow: 1000,
        //left:956,
        //top:492
        responsive: true,
        effectIn: 'slideBottom',
        effectOut:'slideBottom',                
    });
});
</script>

所以我想出了一个解决方案，但它似乎只是一点点 - 通过使用$（输入...）它只能找到宽度，但当我使用顶部的代码，它弹出窗口不跑。只有宽度，它运行和正确响应 - 一如既往，任何帮助表示赞赏。非常感谢大家。这是新代码：

// JavaScript
function jsUpdateSize(){
    // Get the dimensions of the viewport
    var width = window.innerWidth ||
                document.documentElement.clientWidth ||
                document.body.clientWidth;
    var height = window.innerHeight ||
                 document.documentElement.clientHeight ||
                 document.body.clientHeight;

    document.getElementById('jsWidth').innerHTML = width;
    document.getElementById('jsHeight').innerHTML = height;

var w;
var h;
//var th;
//var lw;
w=width-500;
h=height-200;
   document.getElementById('w1').innerHTML = w;
   document.getElementById('h1').innerHTML = h;

$(function ()
{
    $.fn.speedoPopup({
      //htmlContent: "",
      theme: "metro",
      width:500,
              height:200,
          href: "http://delanceyplace.com/subscribe_iframe.php",
      ///autoShow: 60000        // 60 Seconds
      autoShow: 1000,
      left: $("input[name='w']"),
    //top: $("input[name='h']"),
              responsive: true,
      effectIn: 'slideBottom',
      effectOut:'slideBottom'       
    });
});



};
window.onload = jsUpdateSize;       // When the page first loads

// window.onresize = jsUpdateSize; //浏览器更改大小时

Answer 1

你能指定右/下而不是左/上吗？

$.fn.speedoPopup({
    //htmlContent: "",
    theme: "metro",
    width:500,
    height:200,
    href: "http://delanceyplace.com/subscribe_iframe.php",
    autoShow: 1000,
    //left:956,
    //top:492
    bottom: 0,
    right: 0,
    responsive: true,
    effectIn: 'slideBottom',
    effectOut:'slideBottom',                
    });
});

Answer 2

$ fn.speedoPopup（{...}）。只会被召唤一次。因此，您必须在“调整大小”事件后删除当前的（或更新其位置）。

我会在你的更新函数中调用jQuery插件。

这是一个精简的示例，它使用Function.bind（...）将宽度和高度作为'this'对象附加。

function update() {
    var w = window.innerWidth;
    var h = window.innerHeight;
    $(function() {
        $("#o").text(this.width + " / " + this.height);
    }.bind({width: w, height: h}));
}
window.onload = update;
window.onresize = update;

将javascript变量插入到javascript函数中

2 个答案: