jQuery的動態對齊

我有這個電話：jQuery的動態對齊

$(document).ready(function() { 
    $("#back").DynamicallyCentering({ 
     Alignment: "Vertical", 
     Speed: 5 
    }); 
    $(window).resize(function() { 
     $("#back").DynamicallyCentering({ 
      Alignment: "Vertical", 
      Speed: 5 
     }); 
    }); 
});

DynamicallyCentering插件：

jQuery.fn.DynamicallyCentering = function(Options) { 
    var Block = $(this); 
    var Defaults = { 
     Alignment: "Both", 
     Speed: 0 
    }; 
    var Options = $.extend(Defaults, Options); 
    var FormatedAlignment = Defaults.Alignment.toLowerCase(); 
    var VerticalFormula = ($(window).height()/2) - (Block.height()/2); 
    var HorizontalFormula = ($(window).width() - Block.width())/2 + $(window).scrollLeft(); 
    StaticPositioning = function() { 
     var PositioningSource; 
     if (FormatedAlignment == "vertical") { 
      var PositioningSource = Block.css("margin-top", VerticalFormula); 
     } else if (FormatedAlignment == "horizontal") { 
      var PositioningSource = Block.css("margin-left", HorizontalFormula); 
     } else { 
      var PositioningSource = 
      Block.css("margin", VerticalFormula + "px " + HorizontalFormula + "px"); 
     } 
     return PositioningSource; 
    } 
    StaticPositioning(); 
};

正如你所看到的，我有一個小插件，「R試圖動態居中層（在這種情況下，「#back」），這不適合我。然後我問：這是動態調整圖層中心的正確方法嗎？

===編輯===

對不起，我不明確的問題。在我的問題更具體的，我帶來更多的細節：

我有一個必要性：動態集中一個容器;

我可以用jQuery來做到這一點。我的代碼之前發佈在同一個線程中，並且他工作正常。但我不知道我是否以正確的方式做到這一點。你能理解我嗎？正如你在我的代碼的調用中看到的，我重複了代碼，這對我來說看起來是錯誤的。

任何人都知道是否有更好的方法來使用OOP概念來做到這一點？

在此先感謝。

來源

2012-06-25 Guilherme Oderdenge

「這看起來不適合我。它怎麼不工作？它在做什麼與你期望它做什麼？ –

哦，對於沒有明確說明的問題抱歉。所以，一切工作正常，但正如你在我的調用中看到的那樣，我在「重複」代碼，並且我不知道這是否正確。有另一種方法來動態地對容器進行居中而無需重複代碼我的意思是，在「面向對象的概念」方式？ –

爲什麼不通過CSS來做到這一點？你可以使用'margin：0 auto'來水平居中一個塊元素;垂直居中有點棘手，但可以完成。見http://blog.themeforest.net/tutorials/vertical-centering-with-css/ –

這段代碼看起來很適合我。如果您指的是重複調用插件兩次的代碼，則可以將其提取到另一個函數中：

var center = function() { 
    $("#back").DynamicallyCentering({ 
      Alignment: "Vertical", 
      Speed: 5 
     }); 
} 

center(); 
$(window).resize(center);

來源

2012-06-25 20:03:21

哦，好吧！我已經嘗試過了，但是我對「代碼縮短」的適用性感到困惑。謝謝！ –

jQuery的動態對齊

回答

相關問題