windows.resize功能问题 [英] windows.resize function issue

问题描述

这是我的代码

$(document).ready(function(){
    $(window).resize(function() {
        if ($(window).width() > 980) {
            $('.info-container a').toggle(function() {
                $(this)
                    .closest('li')
                    .find('.work-info')
                    .fadeIn();
                return false;
            }, function() {
                $(this)
                    .closest('li')
                    .find('.work-info')
                    .fadeOut();
                return false;
            });
        }
        else {
            $('.info-container a').unbind('click'); 
        }
    });
});

当浏览器宽度> 980像素时，我想显示隐藏的div。

I want show the hidden div on click, when browser width > 980px.

当我打开页面 - 代码不工作，只要窗口的宽度不会改变。

when I open page - code does not work as long as the width of the window will not change. After that, it works fine.

这是我的代码在 JSFIDDLE 但它不工作在那里...

Here is my code in JSFIDDLE but it doesn't work there...

推荐答案

这是因为你的函数在$ .resize（）;功能。如果你想要它的工作，你需要启动点击事件和调整大小事件。

It is because your functions are in $(window).resize(); function. If you want for it to work, you need to launch at click event and resize event.

你可以通过单独包装你的函数，并在文档启动它们来实现。单击并在window.resize。

You can achieve this by wrapping your functions separately, and launching them at document.click and at window.resize.

$(document).ready(function(){
    var hide = function(){
        if ($(window).width() > 980) {
            $('.info-container a').toggle(function() {
                $(this)
                    .closest('li')
                    .find('.work-info')
                    .fadeIn();
                return false;
            }, function() {
                $(this)
                    .closest('li')
                    .find('.work-info')
                    .fadeOut();
                return false;
            });
        }
        else {
            $('.info-container a').unbind('click'); 
        }
    };
    $(document).click(hide);
    $(window).resize(hide);
)};

这篇关于windows.resize功能问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！