javascript - 重新打开 SqueezeBox,不带双动画

标签 javascript animation mootools squeezebox

我有一个开放的 SqueezeBox在屏幕上,并希望使用不同的 URL 重新打开它,以响应单击框中的链接。我正在尝试各种方法以新的(不同的)大小打开新的 URL,以便动画流畅并且仅运行一次。不幸的是,标准方法(open 方法)似乎动画两次(或运行“小故障”的毫无意义的动画)。

作为替代方案,我正在尝试 setContent,但这似乎没有提供设置选项的方法,据我所知 in the source ,一旦设置了选项,SqueezeBox.initialize 就不会执行任何操作。

    // (Attempt 1)
    // This animation is a bit glitchy, have tried resetting resizeFx
    // and sizeLoading to reduce bounce. Ideally want it to morph from
    // current size to size{} without shrinking to sizeLoading{} first.
    if ( false ) {
        SqueezeBox.open(
            url,
            {
                size: { x: 500, y: 500 },
                sizeLoading: { x: 500, y: 500 },
                resizeFx: {
                    duration: 0
                }
            }
        );
    }

    // (Attempt 2)
    // Empty SqueezeBox then reset its contents
    $( 'sbox-content' ).empty();
    // Unfortunately here there appears no way to reset the size with
    // the ajax method,
    // and the call to initialize is ignored.
    SqueezeBox.initialize(
        {
            size: { x: 100, y: 400 },
            /* Set the loading size to the current size? */
            sizeLoading: { x: 700, y: 700 }
        }
    );
    // Load the new content in via ajax
    SqueezeBox.setContent( 'ajax', url );
    // So, I would need to call resize() here, causing a second animation

see here建议切换到另一个模态灯箱插件,但放弃 SB 并不是一个真正的选择,而且我不热衷于同时运行这两个插件。

最佳答案

啊哈,这是一个解决方案 - 避免 SqueezeBox 调用!相反,我使用标准 MooTools AJAX 调用手动加载内容。这不会打开通常的等待旋转器,但我希望可以修复它。

// Let's load page in AJAX manually; reopening with open() or
// setContents() appears to cause double or glitchy animations.
var myRequest = new Request.HTML(
    {
        url: url,
        method: 'get',
        evalScripts: true,
        update: $( 'sbox-content' )
    }
).send();

// @todo If no size change is needed don't run this
// to avoid glitchy animation
SqueezeBox.resize(
    { x: 500, y: 500 },
    false
);

请注意,我使用的是 evalScripts: true,因此可加载代码段中的任何 JavaScript 都会像我使用 SqueezeBox.open() 一样运行。

关于javascript - 重新打开 SqueezeBox,不带双动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14590522/

相关文章:

ios - 动画不以 imageView 为中心(iOS)

javascript - jQuery 动画整体表现不佳。我怎样才能让它更顺畅?

css - 如何更改 CSS 样式取决于浏览器

javascript - mootools 无法在 ie 上的另一个元素的底部注入(inject)一个元素

javascript - 以概率打乱JS数组

javascript - 简单的单击事件未触发,控制台返回不可能或根本没有错误

javascript - 如果满足条件,则向序列添加 promise

ios - 我可以在任意 UIView 变量上设置动画吗?

javascript - Mootools:拒绝设置不安全 header "Connection"

javascript - 有没有一种直接的方法可以使用 jQuery 将文本附加到 DOM 元素?