$("#imgT").css("height" , 90 + "vh"); // I need to avoid scrolling to see-6ren">
gpt4 book ai didi

jquery - 加载后如何避免额外的重新排列页面?

转载 作者:行者123 更新时间:2023-12-01 03:12:25 27 4
gpt4 key购买 nike

<body>
<img id='imgT' src='<?php echo $folder;?>/01.jpg' alt="img">

<script>
$("#imgT").css("height" , 90 + "vh"); // I need to avoid scrolling to see the entire image.
var a = $("#imgT").width() + 3;
alert (a); // result is 3 instead of real width
$("#container").css("width", a);
</script>

...
</body>

在 css 文件中,除了 display:block; 之外,没有任何关于 imgT 的内容。

因此,在这种情况下,js 将 0 显示为 imgT 宽度,即看不到它。

当我将 js 代码放入单独的 .js 文件中时,一切正常,除了在页面加载结束时重新调整丑陋的图像大小之外。

我想在加载页面后避免这种额外的重新排列页面,即在加载图像后立即重新调整大小,但 javascript 无法正确看到其宽度。

有什么帮助吗?

最佳答案

您的代码在创建图像元素后运行,但是内部图像的加载是异步的。您需要等到 <img> 内的图像完全加载后,JavaScript 才会报告正确的测量结果:

<script>
$(window).load(function() {
$("#imgT").css("height", 90 + "vh"); // I need to avoid scrolling to see the entire image.
var a = $("#imgT").width() + 3;
alert(a); // result is 3 instead of real width
$("#container").css("width", a);
});
</script>

$(window).load(function() {仅在所有异步元素(如 <iframe>)之后执行子句和<img>正在满载中

关于jquery - 加载后如何避免额外的重新排列页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24760154/

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