窗口大小更改时更改 div 的属性 [英] Change attribute from a div when window size change

问题描述

我使用 jQuery 移动版.在这种情况下，当屏幕宽度小于 960 像素时，我想将可折叠的数据角色添加到 div.

I work with jQuery mobile. In this case i want to add the data-role collapsible to a div, when the screen width less than 960px is.

在我的示例中，它仅在您加载站点时有效.但我希望，当我在不重新加载页面的情况下调整浏览器大小时，它也能正常工作.

In my example it only works when you load the site. But I want, that it also works when I resize the browser without reload the page.

从 > 960 px 更改为 <例如，当您手动旋转平板电脑或调整浏览器窗口大小时，即为 960 像素.

The change from > 960 px to < 960 px is for example when you rotate a tablet or resize the browser window by hand.

$( document ).on( "pagebeforecreate", function() {
    if ($(window).width() < 960) {
       $(".medis_collaps").attr("data-role","collapsible")
    }
});

编辑

.resize() 不起作用，因为我似乎必须重新加载页面才能使 data-role="collapsible" 工作.

.resize() doesn't work , because it seems that I have to reload the page to make data-role="collapsible" working.

推荐答案

你可以这样使用:

$( document ).on( "load resize pagebeforecreate", function() {
    if ($(window).width() < 960) {
       $(".medis_collaps").attr("data-role","collapsible")
    }
});

这篇关于窗口大小更改时更改 div 的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！