我已经检查了图像,它们确实存在于服务器上。
我使用此代码在CSS规则中包含图像
.Invite{background: url("../images/interface/Shop/Btn_Ad_Invite_all.png") 0px 0px;}
.Invite:hover{ background-position-x: -86px; }
.Invite:active{ background-position-x: -172px; }
<div class="Button Invite" onclick="invite()"></div>
我正在尝试使用jQuery Ajax get并尝试在浏览器控制台中使用此代码将图像注入到body中
$.get("https://fb.spot-the-differences.com/test/images/interface/Shop/Btn_Ad_Invite_all.png");
$.get("images/interface/Shop/Btn_Ad_Invite_all.png");
$("body").append("<img src='https://fb.spot-the-differences.com/test/images/interface/Shop/Btn_Ad_Invite_all.png'/>");
$("body").append("<img src='images/interface/Shop/Btn_Ad_Invite_all.png'/>");
我的所有浏览器(IE,Firefox,Chrome)都说无法获得没有响应的图像。 我本地网络中的其他计算机可以毫无问题地获得图像。
如果我复制图片网址并粘贴到浏览器地址,我可以毫无问题地收到图片:
有人可以解释为什么会发生这种情况以及如何解决这个问题我不希望这种情况发生在我网站上的客户端。
我希望得到任何形式的对话或帮助。
当我尝试将有问题的图像的路径更改为任何不准确的路径时,我发现了可疑的事情,我仍然处于状态失败状态,而不是找不到像这样的404
<img src='http://google.Shop/Btn_Ad_Invite_all.png'/>
jsfriddle我看到IMG4与IMG2相同,甚至没有出现图像损坏的图标
非常感谢我提供一些建议。
答案 0 :(得分:1)
看起来您使用的是与网页(HTTPS与HTTP)不同的协议,这可能会导致浏览器出现跨域安全问题。尝试:
$.get("http://fb.spot-the-differences.com/test/images/interface/Shop/Btn_Ad_Invite_all.png");
或者这应该与页面协议无关[
]
$.get("/test/images/interface/Shop/Btn_Ad_Invite_all.png");
如果你的目标是动态显示图像,我同意一些评论虽然设置 image标签的src属性并使用css来定位sprite。例如:
$('img').attr('src', '/test/images/interface/Shop/Btn_Ad_Invite_all.png');)