2012-09-06 5 views
3

가능한 중복 :
How to silently hide “Image not found” icon when src source image is not found크롬 - 이미지를 찾을 수 없습니다 아이콘

를 찾을 수 없습니다 이미지의 기본 아이콘을 해제 할 수있는 방법이 있나요? src에 404를 지정하면 Chrome에 작은 아이콘이 표시됩니다. Firefox는 아무 것도 표시하지 않으며 Chrome에서도 동일하게 사용하고 싶습니다. 그 해결책이 있습니까? jQuery를에

var img = document.getElementById("myImg"); 
img.onerror = function() { 
    this.style.display = "none"; 
} 

: 이미지로드에 실패한 경우

+0

누군가 크롬을 사용하여 크롬을 방문하거나 웹 사이트에 표시하려면? – Salketer

+0

누군가가 Chrome 브라우저를 통해 내 사이트를 방문 할 때마다 해당 아이콘을 표시하고 싶지 않습니다. – tunarob

+0

당신은 ['-moz-force-broken-image-icon : 0;']과 같은 것을 의미합니다 (https://developer.mozilla.org/en-US/docs/CSS/-moz-force-broken-image- 아이콘)하지만 웹킷? –

답변

7
<img onerror='this.style.display = "none"'> 

또는

당신은 행동하는 자바 스크립트의 onerror 이벤트를 사용할 수 있습니다

$("#myImg").error(function() { 
    $(this).hide(); 
}); 

또는 모든 이미지에 대한

:

$("img").error(function() { 
    $(this).hide(); 
    // or $(this).css({visibility:"hidden"}); 
}); 

이미지를 숨기면 레이아웃이 변경 될 수 있으므로 .hide() 대신 visibility: hidden을 사용해야합니다. 웹상의 많은 사이트는 지정된 이미지 위치를 사용할 수 없을 때 해당 이미지에 src 속성을 지정하여 기본 "이미지 없음"이미지를 사용합니다.

+0

.error() $ (window) .load() 또는 $ (document) .ready()에서 더 나은가? – tunarob

+0

'$ (document) .ready()'이미지가로드 된 후에'$ (window) .load()'가 실행된다고 생각합니다. 이벤트가로드되기 전에 이벤트에 연결하려고합니다. –

0

htaccess를 사용하는 작은 해결책이 있습니다. 그림을 찾을 수없는 경우 1x1 투명 PNG로 리디렉션해야합니다. 유일한 단점은 명시 적으로 이미지의 너비와 높이를 정의하면 이미지가 여전히 필요한 위치를 차지한다는 것입니다. 그러나 아무 것도 볼 수 없습니다.

관련 문제