Question

我的下拉菜单中有一个脚本。我希望响应（1024px）它关闭。当我放大窗户时，他会重新激活。

我设法做了更多或更少的工作：

class EditForeightKeys < ActiveRecord::Migration[5.1]
  def change
    # remove the old foreign_key
    remove_foreign_key :tasks, :post

    # add the new foreign_key
    add_foreign_key :tasks, :post, on_delete: :cascade

  end
end

不幸的是，使用此解决方案，当我在桌面模式（> 1024px）加载页面时，我必须调整窗口大小（一个像素就足够了）来激活脚本。

如果我缩小窗口（我从桌面模式切换到移动模式），脚本将在移动设备上激活。

我试过这个，但它根本不起作用：

$(window).resize(function () {
  if ($(this).width() > 1024 ){
    w.accessibleMenuConfig.init();
  }
});

感谢您的帮助！

Answer 1

您需要处理页面加载和调整大小事件才能使其正常工作。我将从创建一个执行该逻辑的函数开始：

function changeAccessibility() {
  if ($(window).width() > 1024 ){
    w.accessibleMenuConfig.init();
  }
}

然后，在每个事件上调用该函数（窗口调整大小和窗口加载 - 后者仅发生一次）。

$(document).ready(function() {
  changeAccessibility();
});

$(window).resize(function () {
  changeAccessibility();
});

Answer 2

当浏览器窗口的大小发生变化时，resize事件将发送到window元素。

$( window ).resize(function() {
   enter code here
});

请检查：https://api.jquery.com/resize/

在加载和调整大小时运行jQuery脚本以响应

2 个答案: