如何設置按鈕的高度視口高度

我這樣做是爲了讓視口高度和設置按鈕高度，它如何設置按鈕的高度視口高度

var viewportHeight = $(window).height(); 
var viewPortHeightStr = `\"${viewportHeight}px\"` 
document.getElementById("button").style.height = viewPortHeightStr 
console.log('viewPortHeightStr = '+viewPortHeightStr) // prints "750px"

控制檯日誌"750px"但按鈕的高度不會受到影響，但是這個工程

document.getElementById("button").style.height = "750px"

爲什麼？

這裏是按鈕標籤

<button id="button" class="btn-basic">x</button>

來源

2017-09-22 the_prole

您需要100％的vport高度？ – jack

我只是學習如何按比例設計查看端口，所以不，我不 –

這是很容易在CSS。使用：

height: 100vh;

這意味着100％的視口高度。

在代碼中，這個問題似乎是：

var viewPortHeightStr = `\"${viewportHeight}px\"` 
// change it to: 
var viewPortHeightStr = viewportHeight + 'px';

段：

var viewportHeight = $(window).height(); 
 
var viewPortHeightStr = viewportHeight + 'px'; 
 
document.getElementById("button").style.height = viewPortHeightStr 
 
console.log('viewPortHeightStr = '+viewPortHeightStr) // prints "750px"

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="button" class="btn-basic">x</button>

來源

2017-09-22 22:09:21 jack

非常感謝，如果你能解釋爲什麼我的解決方案不起作用，那會在技術上回答我的問題 –

檢查我編輯的答案。 – jack

應該

document.getElementById("button").style.height(viewPortHeightStr);

，而不是

document.getElementById("button").style.height = viewPortHeightStr

來源

2017-09-22 22:12:58 Johannes

如何設置按鈕的高度視口高度

回答

相關問題