代碼在JavaScript中動態調整大小不正常

我有這個模態代碼，我試圖動態計算寬度和高度，並將其添加到模態div，但是當我把觸發器代碼放入網站（進入一個託管在線）這個調整大小的代碼不能正常工作，而不是動態調整大小，但是當我在一個Xampp服務器（在本地主機）中測試這個代碼時，它工作正常。代碼在JavaScript中動態調整大小不正常

我不想使用Jquery來避免與網站的任何衝突。

在http://jesusbwebdesigner.com/staging_sdv/en下方的滑塊有一個按鈕叫「開放模式」，即是例子

任何想法？

<div id="myModalButton" class="modalBucket"> 
    <div class="modal-content-bucket"> 
    <span class="close-bucket">&times;</span> 
    </div> 
</div> 

var modal = document.getElementById('myModalButton'); 
var modalContent = document.getElementsByClassName('modal-content-bucket'); 


modal.style.width = window.innerWidth; 
modal.style.height = window.innerHeight; 
modalContent[0].style.width = window.innerWidth - 40; 
modalContent[0].style.height = window.innerHeight - 40;

來源

2017-03-07 user3810167

你能提供你的網址嗎？ –

http://jesusbwebdesigner.com/staging_sdv/en/下面滑動有一個按鈕調用「打開模式」 – user3810167

嘗試以像素格式添加寬度和高度。所以用這個更新scriptBucket.js文件中的方法代碼。

btn.onclick = function() { 
    modal.style.width = window.innerWidth+"px"; 
    modal.style.height = window.innerHeight+"px"; 
    modalContent[0].style.width = (window.innerWidth - 40)+"px"; 
    modalContent[0].style.height = (window.innerHeight - 40)+"px"; 
    modal.style.display = "block"; 
    document.body.classList.add("open-modal-bucket"); 
}

來源

2017-03-07 18:48:29

謝謝，它工作正常 – user3810167

代碼在JavaScript中動態調整大小不正常

回答

相關問題