无法淡入使用jquery加载的图像

7kjnsjlb 于 2023-10-17 发布在 jQuery

关注(0)|答案(2)|浏览(100)

我是jQuery的新手，我不明白为什么会显示图像，但它并不像jQuery文档所建议的那样淡入。

<!DOCTYPE HTML>
<html lang='en'>
<head>
<meta charset="UTF-8">
<title>slide show test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<img id="image" alt="slide" style="opacity:0.5;"/>
<script>
var x="tiananmen-square-600.webp";
$("#image").attr('src', x, function() {
        $("#image").fadeIn( "slow");
        });
</script>
</body>
</html>

救命啊

jquery

来源：https://stackoverflow.com/questions/77262261/cant-fade-in-an-image-loaded-with-jquery

2条答案

按热度按时间

a5g8bdjr1#

.attr()不接受第三个参数。
我觉得你想要这样的东西

const x = "https://picsum.photos/200/300";

const image = $("#image").hide().attr("src", x);

image[0].decode().then(() => {
  image.fadeIn("slow");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img id="image" />

即
1.选择#image元素
1.最初隐藏它
1.设置它的src属性
1.等待图像数据可用（参见decode()）
1.淡入

赞(0）回复(0）举报 2023-10-17

kfgdxczn2#

我通过删除img标签中的不透明样式并将jQuery代码替换为以下代码来使其工作：

$("#image").fadeOut(0);
$("#image").attr('src', x);
$("#image").fadeIn("slow");

赞(0）回复(0）举报 2023-10-17

我来回答

无法淡入使用jquery加载的图像

2条答案

相关问题

热门标签

最新问答