Question

嗨，问题是当屏幕低于768px时，height（）函数起作用；运行时，一切都很好，但是当我将窗口屏幕拖到大于768px 时，** height（）;功能仍然是仍然保留在该位置（当高于768px时应该消失），但是如果我刷新页面， height（）;功能只会消失。我可以知道问题出在哪里吗？

modalPop : function() {
    (function($) {
        //
        'use strict';

        // modal
        var popups = $('.modal-boz'),
            totalPopups = popups.length;

        if ( popups.length ) {
            for ( var i = 0; i < totalPopups; i++ ) {
                var popup = $(popups[i]);

                popup.each(function() {

                    $(this).children('a.cta').click(function(e) {
                        $(this).parent().children('.popup-modal').fadeIn(350);
                        if( $(window).width() < 768 ) {
                            var _topPos = $('body').height() - $('.popup-modal .form-wrapper').height();
                            _topPos-= 300;
                            $('.popup-modal > .modal-content').css('top',_topPos+'px');
                           console.log('top section show')
                        } else {
                           console.log('top section hidden')
                        }
                        e.preventDefault();
                    });
                });
            }
        }

    })(jQuery);
}

Answer 1

您只需要将一个函数附加到窗口调整大小事件即可。

$(window).on('resize', function (event) { ... })

这将在窗口每次更改宽度或高度时调用提供的函数。

了解更多：https://developer.mozilla.org/en-US/docs/Web/Events/resize

jQuery屏幕大小直到刷新页面后才反映出来

1 个答案: