Question

你好我写了一些脚本，但我认为需要一些修复才能正常工作。我的目标是将.height-driven设置为与.height-driver相同的值，但在调整大小时也需要工作。调整窗口大小后，一切正常，但在加载jQuery（窗口）.resize（）;没有加载所以我需要超时它其他情况它不会工作你可以看到它在2秒后运行RUN脚本并且窗口宽度超过768px。如何毫无延迟地调用此函数？

当你删除延迟并只放jQuery（窗口）.resize（）;它会在这里工作，但在网站有时你必须刷新它4,5,6次因为它设置。高度驱动高度为0px 替代版本在jsfiddle上工作但不在实际页面中：http://jsfiddle.net/2Lod0sxq/

实际版本： http://jsfiddle.net/ponciusz/z818ehxt/

的jQuery

jQuery(document).ready(function(){ 
// resize after resizing
    jQuery(window).resize(function(){  
        //if less than 768 set heignt auto
        if ($(window).width() < 768) {
            jQuery('.height-driven').css({"height": "auto" });  
        }
        // if bigger run
        else {
            jQuery('.height-driven').each(function(){             
                var ka_height = jQuery('.height-driver').height();
                jQuery(this).css({"height": ka_height });      
            })
        }
    }) 
    // after page load check if less 768 if yes set height to auto
    if ($(window).width() < 768) {
        jQuery('.height-driven').css({"height": "auto" });
    }
    // if more resize after 1 sec - IF DELETE THIS SET HEIGHT WONT WORK after refresh
    else {
        setTimeout(function() {
            jQuery(window).resize();
        }, 2000);             
    }
})

HTML：

<div class="uk-container uk-container-center">
    <div class="uk-grid" data-uk-grid-margin="">
        <div class="uk-width-medium-1-2">
            <div class="uk-panel uk-vertical-align height-driven service-wrap">
                <div class="uk-vertical-align-middle ka_fade service-content">
                    <h2>LOREM</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodoconsequat. Duis aute irure dolor in reprehenderit in voluptate velit esse.</p>
                </div>
            </div>
        </div>

        <div class="uk-width-medium-1-2">
            <div class="uk-panel height-driver">
                <img class="uk-align-center" src="http://dummyimage.com/600x700/000/fff" alt="">
            </div>
        </div>
    </div>
</div>

Answer 1

我找到了解决方案：http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/

我替换了第一行：

jQuery(document).ready(function(){

到此：

jQuery(window).load(function(){

现在工作得很完美。

两个div相同的高度响应

1 个答案: