2013-10-17 5 views
0

다음은 양식을 제출할 이미지 입력 ​​코드입니다. 그것은 최신 파이어 폭스와 IE에서 멋지게 보인다. Chrome (버전 30.0.1599.101 m)에서 클릭하면 이미지가 사라지고 양식이 제출 될 때까지 대체 텍스트가 포함 된 빈 윤곽이 표시됩니다. 그것은별로 중요하지 않지만 성가신이며 가능한 경우 수정하고 싶습니다. 아무도 이것을 방지하는 방법을 알고 있습니까?Chrome에서 클릭하면 입력 이미지가 사라집니다.

onmousedown/onmouseout은 Chrome에서 작동하지만 이미지 변경이 지연되어 표시가 제안됩니다. 이미지가 캐싱되지 않습니다. 이것은 IE 나 Firefox에서 발생하지 않습니다.

참고 : 외부 CSS는

<input class="buy_butt" src="/img/gen/buy-now.gif" id="addtocart" name="addtocart" onmousedown="this.src='/img/gen/buy-now-onclick.gif'" onmouseout="this.src='/img/gen/buy-now.gif'" alt="add to cart" type="image"> 
<img src="/img/gen/buy-now-onclick.gif" style="display:none;" alt="add to cart onclick"> 

답변

0

귀하의 코드가 크롬에 나를 위해 작동하는 것 같다 등 유일한 여백, 테두리 등의 관련이 없습니다. 그러나 페이지의 onload 이벤트의 일부로 수동으로 이미지를 미리로드 했습니까? 당신의 머리 태그 내부

은 다음과 같습니다 : 문서의 onload 이벤트에서

<script language = "JavaScript"> 

function preloader() { 
    buyNowOnClick = new Image(); 
    buyNowOnClick.src = "/img/gen/buy-now-onclick.gif"; 
} 

</script> 

통화 프리 로더를. 즉 :

이와
<body onload="javascript:preloader()"> 

<!-- Your Page goes here --> 

</body> 

, 거기에 숨겨진 img 태그를 추가 할 필요가 없습니다 당신이 이미지를 당신이 할 방법을 전환 지연을 기 대해서는 안 귀하의 이미지가 이미 사전로드됩니다.

희망이 도움이됩니다.

0

Chrome에서이 문제가 발생했는데 입력이 클릭 될 때까지 정상 및 마우스 오버 이미지가 잘 표시되어 사전로드 문제가 아닌 것으로 보입니다. 입력이 상자에 대체 텍스트가 있습니다. http://mir.aculo.us/2011/12/07/the-case-of-the-disappearing-element/을 통해이 스타일을 입력에 추가하면 문제가 사라졌습니다.

-webkit-transform : translateZ (0.00001px);

관련 문제