我希望此腳本在頁面加載以及調整大小時都能工作

Question

該網站響應迅速

$(window).bind('resize', function() {
    $('#drop_ul').css('width', $('#container').width());
    $('#drop_ul').css('left', $('#container').css('margin-left'));
});

$(document).ready(function(){
    $('#drop_ul').css('width', $('#container').width());
    $('#drop_ul').css('left', $('#container').css('margin-left'));
});

Answer 1

您可以將邏輯提取到其自己的函數中，然后可以在兩個事件下調用該邏輯。 嘗試這個：

function updateUI() {
    $('#drop_ul').css({
        'width': $('#container').width(),
        'left': $('#container').css('margin-left')
    });
}

$(document).ready(function() {
    updateUI(); // on load
    $(window).on('resize', updateUI); // on window resize
});

請注意，我統一了css()調用，並使用了on而不是bind 。

另外，如果網站響應良好，則最好使用CSS媒體查詢。