Javascript stellar.js能否在调整窗口大小时重新调整元素偏移？

有没有办法在浏览器/窗口大小调整中重新初始化stellar.js，以便重新调整元素偏移量？

经过一番研究，我找到了这个方法。在我的例子中，我有“幻灯片”，其中包含我的恒星元素，它们的大小与视口的全宽/全高一致。我需要调整它们的大小以改变平板电脑的方向

$(window).resize(function(){
    winHeight = $(window).height();
    $("#scrollWrapper > div").height(winHeight);

    // Find out all my elements that are being manipulated with stellar
    var particles = $(window).data('plugin_stellar').particles;

    // Temporarily stop stellar so we can move our elements around
    // data('plugin_stellar') let's me access the instance of stellar
    // So I can use any of its methods. See stellar's source code
    $(window).data('plugin_stellar').destroy();

    $.each(particles, function(i, el){
        // destroy() sets the positions to their original PIXEL values. 
        // Mine were percentages, so I need to restore that.
        this.$element.css('top', '');

        // Once the loop is finished, re-initialize stellar
        if(particles.length - 1 == i){
            $(window).data('plugin_stellar').init();
        }
    });
});

如果将元素设置为左/顶的原始像素值并不重要，那么您可以逐个调用destroy&init：

$(window).data('plugin_stellar').destroy();
$(window).data('plugin_stellar').init();

---

如果您在元素（即，

$（“#元素”）.stellar（）；

而不是

$.stellar（）；

）上实例化stellar，则用选择器替换“窗口”。

首先，听起来您可能在水平对齐方面有问题（假设它是垂直站点）。如果是这样，您可能只需要禁用水平滚动：

$.stellar({
    horizontalScrolling: false
});

如果这不能解决您的问题，那么Stellar.js有一个未记录的特性，允许您刷新插件

例如，假设您使用Stellar.js，如下所示：

$.stellar();

$(window).resize(function() {
    $.stellar('refresh');
});

您可以使用以下命令刷新它：

$.stellar('refresh');

因此，要在调整大小时刷新它，可以执行以下操作：

$.stellar();

$(window).resize(function() {
    $.stellar('refresh');
});

---

希望这能为您解决所有问题。

我还注意到手机上的奇怪偏移，这可能是由于Firefox/Chrome在向下滚动时，当位置栏再次可见时调整网络视图大小的方式造成的

您的问题的答案在“配置一切”的一节中：

因此，默认情况下这是错误的。要启用此功能，请使用

.stellar（{responsive:true}）

---

真正的问题是。。。为什么默认情况下会禁用此选项？它似乎解决了我注意到的问题，除了iOS。

正是我想要的！我当时的处境和这里差不多，谢谢你！这应该作为某种函数包含在函数中，开箱即用的刷新在这种情况下没有帮助，我认为它与使用百分比有关。