我有两张图片，一张带有黑色徽标，另一张带有白色徽标。当浏览器的宽度小于768px时，我希望有白色徽标；而当浏览器的宽度小于768px时，我希望有黑色徽标。我尝试了一些操作，但只有在重新加载页面后才能实时更改。
$(function() {
if($(window).width() < 768){
$('.logo').find("img").attr("src","/images/Trin-02.png");
}
else{
$('.logo').find("img").attr("src","/images/Trin-01.png");
}
});
有什么建议吗？谢谢
https://api.jquery.com/resize/
您正在正确检查窗口的宽度，但是仅在页面首次加载时才这样做！
而是在resize每次调整屏幕大小时使用该函数运行脚本
$(window).on("resize", function(){
if($(window).width() < 768){
$('.logo').find("img").attr("src","/images/Trin-02.png");
}
else{
$('.logo').find("img").attr("src","/images/Trin-01.png");
}
})
虽然这听起来更像是CSS媒体查询的工作，但是我们并不能满足您的所有需求：)
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句