gpt4 book ai didi

javascript - 单击浏览器中的最大化或最小化按钮时启用调整图标大小

转载 作者:行者123 更新时间:2023-12-04 02:04:16 25 4
gpt4 key购买 nike

我编写了这段代码以在调整浏览器大小时调整图标大小。单击最大化按钮或最小化按钮时,代码不起作用。

单击浏览器中的最大化和最小化按钮以调整 switch_ico 图标大小时,如何启用调用我的 displayWindowSize 函数?

<script>
//window.onresize = displayWindowSize;
//window.onload = displayWindowSize;

$(window).resize(function()
{
setTimeout(function() {
displayWindowSize();
}, 100);
});

function displayWindowSize() {
var tpReportWidth = $("#tpReport").width();
var iconWidth = $("#switch_icon").width();
var newIconWidth = Math.round(tpReportWidth/49.6).toFixed(2)
console.log('tpReportWidth: ' + tpReportWidth + " ,iconWidth: " + iconWidth + 'newIconWidth: ' + newIconWidth);
$("#switch_icon").attr('height',newIconWidth);
$("#switch_icon").attr('width',newIconWidth);
};
</script>

最佳答案

调整大小事件确实会在 chrome/firefox 中触发。
调整大小、最大化、取消最大化事件将触发调整大小事件。
最小化(完全隐藏浏览器的最小化)将触发可见性更改事件。

您确定问题不是由其他原因引起的吗?
下面的代码将在每次触发调整大小/可见性更改时增加一个计数器。

请注意,由于代码段是在 iframe 中运行的,因此您必须将代码段展开到整页才能看到事件

//window.onresize = displayWindowSize;
//window.onload = displayWindowSize;

$(window).resize(function() {
setTimeout(function() {
displayWindowSize();
}, 100);
});

var resizeCount=0;
function displayWindowSize(){
$('.resize-count').text("resizes:" + ++resizeCount);

};


document.addEventListener("visibilitychange", function() {
displayMinimize()
}, false);
var minimizeCount=0;
function displayMinimize(){
$('.visibility-count').text("visibility:" + ++minimizeCount);
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="resize-count">
resizes: none
</div>


<div class="visibility-count">
visibility: none
</div>

关于javascript - 单击浏览器中的最大化或最小化按钮时启用调整图标大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48164309/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com