Flexslider 2，如何加载(文档).准备功能

Question

我使用WooThemes Flexslider 2插件在我的WordPress框架。
下面是代码:

$(window).load(function() {
    $('#flexslider-<?php echo $postid; ?>').flexslider({
        smoothHeight:   true,
        slideshow:      false,
        start: function(slider) { 
            slider.container.click(function(e) { 
                if(slider.animating) { 
                    // action
                } else {
                    slider.flexAnimate(slider.getTarget('next'));
                }
            });
        }
    });
});

使用"$(window).load(function() {"

如果我改变"$(window).load(function() {"到"$(document).ready(function(){"滑块不起作用。在Safari中，脚本加载成功，但没有获得当前图像的高度。如何使这个脚本与"$(document).ready(function(){"在所有浏览器上工作?

由于

Answer 1

您可以编写一个间隔函数来查看$('#flexslider-<?php echo $postid; ?>')元素中的第一个图像。加载完成后，调用flexslider函数。

这是给你一个提示，未经测试:

$(document).ready(function(){
    var firstImage = $('#flexslider-<?php echo $postid; ?>').find('img').filter(':first'),
        checkforloaded = setInterval(function() {
            var image = firstImage.get(0);
            if (image.complete || image.readyState == 'complete' || image.readyState == 4) {
                clearInterval(checkforloaded);
                $('#flexslider-<?php echo $postid; ?>').flexslider({
                    // your options
                });
            }
        }, 20);
});