2014-09-04 8 views
0

버튼을 클릭하면 아약스 전화를 걸고 버튼을 클릭하면 .gif 이미지가 팝업되는 웹 페이지가 있습니다. 코드 우는 나는이div와 이미지가 Chrome에 표시되지 않습니다.

HTML

<div class="overlay" id="enrollMeLoading" style="display:none"> 
    <img src="~/Images/loading.gif" style="width: 6%; margin-left: 43%; margin-top: 25%;" /> 
</div> 
을 수행하는 데 사용한

jQuery를 : 나는 그것을하려고 할 때 버튼이 이미지는이 기능은 파이어 폭스에서 작동하고 최대

$('#enrollMeLoading').show(); 

보여 주어야 클릭 만에 Chrome에서는 이미지가 표시되지 않습니다.

문제를 해결하는 데 도움을주십시오.

+0

문제 성명서의 jsfiddle 링크를 공유해주십시오. –

+0

'~'에 대해'& # 126'을 시도하십시오. – loveNoHate

+0

비슷한 코드가 작동합니다. [this] (http://jsfiddle.net/90ssvnry/)를 참조하십시오. –

답변

0

버튼의 onclick에서이 코드를 사용하십시오.

 $('#enrollMeLoading').show();       
      setTimeout(function(){ 
//Make your ajax call here 
    }, 100); 

이 경우 gif가 나타나고 ajax 호출이 발생합니다. u가 ajax를 show statement 바로 다음에 호출하면 gif는 대부분의 시간을 표시하지 않습니다.

2

DEMO

HTML을 시도해보십시오

<input type="button" id="btn" value="show imgae" /> 

<div class="overlay" id="enrollMeLoading" > 
    <img src="~/Images/loading.gif" style="width: 6%; margin-left: 43%; margin-top: 25%;" /> 
</div> 

CSS :

#enrollMeLoading { 
    border:1px solid #f00; 
    min-height:200px; 
} 

#enrollMeLoading img { 
    border:1px solid #f00; 
    min-height:200px; 
    display:none; 
} 

JQuery와 :

$(function(){ 
    $('#btn').on('click',function(){ 
     $('#enrollMeLoading img').css('display','block');  
    }) 
}) 

참고 : 당신은에 쇼를 줄 수 없다 현재 요소, 별도의 버튼을 만들어야합니다

관련 문제