無法通過javascript控制CSS底部屬性

好吧，所以我有一個div，並在其內部畫布。從我的HTML文件：無法通過javascript控制CSS底部屬性

<div id="container"> 
    <canvas id="game" width="600px" height="2000px"></canvas> 
</div>

從css文件：

#game{ 
    /*background-color: #99CC00;*/ 
    background:-moz-linear-gradient(top, #00b7ea 0%, #008793 14%, #004b9b 43%, #1f00ea 74%, #008793 89%, #009ec3 100%); 
    bottom: 0px; 
    position: absolute; 
} 
#container{ 
    position: relative; 
    width: 600px; 
    height: 500px; 
}

什麼我想要做的是控制#game的 '底部' 值是：

($("#game").css("bottom")),

把它放在if語句中，如果是true，則自動更改它。

但是，當我嘗試有一個我無法理解的問題。我有一個變量s。其中s應該是應該改變的數量，它不是一個固定的數字。

，當我試圖($("#game").css("bottom", -s)); 什麼也沒發生，所以要檢查它，我做了以下內容：

alert(($("#game").css("bottom", -s)));得到的答覆是[對象的對象。

而如果我只是alert(($("#game").css("bottom")));答案是正確的0px。

我錯過了什麼？幫助將非常感謝！

來源

2014-08-27 user3676606

您是否嘗試過's'上的'parseInt（）'以確保它是數字？ – StaticVoid 2014-08-27 13:15:57

嘗試添加'px' - '$（「＃game」）.css（「bottom」，-s +'px'）' – Pete 2014-08-27 13:21:22

.css(name, value)將設置name的css屬性等於value。它不會改變值，就像x += 1會改變一個變量。

因此，你應該做的是這樣的：

var oldValue = parseInt($("#game").css("bottom")); 
$("#game").css("bottom", (oldValue - s) + "px")

的parseInt是必要的，因爲正如你所說的，它返回0px，這是一個字符串。

來源

2014-08-27 13:19:40 Stryner

它仍然需要一個單位，除非值實際爲0. – CBroe 2014-08-27 13:49:30

哦，沒錯！謝謝，我編輯了相應的答覆。 – Stryner 2014-08-27 13:54:13

您可以更改值，並設置爲：

$("div").on("click", function() { 
    $(this).css({ 
    height: function(index, value) { 
     return value * 1.2; 
    } 
    }); 
});

的1.2當你點擊的div是一樣r在你的代碼，在「格」高度自動增加。它可以幫助你。

來源

2014-08-27 14:01:49 Zeb

無法通過javascript控制CSS底部屬性

回答

相關問題