將javascript變量插入javascript函數

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

你能指定right/bottom而不是left/top嗎？

$.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;