Question

我想知道这是否可行。我已经在网站上的div上设置了jScrollPane，但是如果屏幕宽度小于或等于580px，我想要破坏此功能。如果您的浏览器在销毁后大小超过580像素，它将重新初始化。

这里有关于插件的销毁/初始化的一些信息http://jscrollpane.kelvinluck.com/destroy.html

因此，我认为我需要将其连接到调整大小功能，而不是演示中的单击触发器。有点像...

$(document).ready(function() {
    // This will fire when document is ready:
    $(window).resize(function() {
        // This will fire each time the window is resized:
        if($(window).width() <= 580) {
            // if smaller or equal
            $('.project-content-parent-container').jScrollPane().destroy();
        } else {
            // if larger
            INITIALISE??
        }
    }).resize(); // This will simulate a resize to trigger the initial run.
});

任何帮助或想法都将不胜感激。

提前致谢， [R

Answer 1

嗯，也许它可以帮到你:) http://jscrollpane.kelvinluck.com/settings.html#autoReinitialise 如果窗口调整大小，此属性会自动重新初始化jscrollpane

Answer 2

如果您想使用jScrollPane进行响应，那么您必须检查此链接：jScrollPane Dynamic Width

Answer 3

我实际上已经解决了这个问题并通过以下解决方案。希望这可以帮助其他有需要的人。

$(window).load(function() {
    if ( $(window).width() < 580) {
        var element = $('.project-content-parent-container').jScrollPane({});
        var api = element.data('jsp');
        api.destroy();
    } else {
        $('.project-content-parent-container').jScrollPane();
    }
});
$(window).resize(function() {
    if ( $(window).width() < 580) {
        var element = $('.project-content-parent-container').jScrollPane({});
        var api = element.data('jsp');
        api.destroy();
    } else {
        $('.project-content-parent-container').jScrollPane();
    }
});

jScrollPane和窗口调整大小触发器

3 个答案: