使用jQuery設置CSS屬性

Question

第一次發布到Stackoverflow並編碼newb。 我看過很多例子，其中人們已經使用jQuery成功設置了CSS屬性。 但是，經過許多令人沮喪的時間，我仍然沒有看到明顯的問題是什么。 這是我非常簡化的代碼。 我知道，如果我將此屬性手動添加到CSS，它將具有預期的效果。 但是，我無法使其使用jQuery。 任何幫助或建議，將不勝感激。 我覺得這似乎很明顯，但我看不到。

我正在使用RoR（並且我已經在app.js中添加了// = require jquery）

CSS

    #magicaldiv{
                margin-left: -175px;
                margin-top: -20px;
                width:350px;
                height:40px;
                position:absolute;}

JS

     var buttonPointer = $('#magicaldiv');
     $(document).ready(updatePointer);
     $(window).resize(updatePointer); 
     function updatePointer(){
                              buttonPointer.css('left', 200);}

我還嘗試了jQuery和JS的多次迭代，包括但不限於..

JS

     document.getElementById("magicaldiv").style.left = 200;

和

     var left = 200 + "px";
     buttonPointer.css('left', left);

和

     buttonPointer.css('left', '200px');

即使文檔建議將所有數字都轉換為字符串並假定為px。

Answer 1

您可能需要將buttonPointer定義包裝在document.ready調用中，具體取決於源代碼的順序。

var buttonPointer;
function updatePointer(){
  buttonPointer.css('left', 200);}

$(document).ready(function() {
  buttonPointer = $('#magicaldiv');
  updatePointer();
});

$(window).resize(updatePointer);