HTML에서 버튼을 사용하여 애니메이션을 재생하는 방법은 무엇입니까?

Question

몸의 시작 부분에 loading이라는 div가 있는데, 그 중은 HTML의 모든 내부 div보다 높습니다. div 안에는 두 개의 gif 이미지가 있습니다. 하나는 gif를 시작하는 것과 유사하고 다른 하나는 gif를로드하는 것입니다. 내가 8 초 동안 애니메이션을 실행하려면 다음 자바 스크립트 코드를 사용했다

<div id="loading"> 
    <img id="loading-image1" src="csi_files/loadsite2.gif" alt="Loading..." /> 
    <img id="loading-image2" src="csi_files/loadsite4.gif" alt="Loading..." /> 
</div> 

HTML. 그러나 문제는 버튼을 클릭 한 후에 애니메이션을 재생해야한다는 것입니다.

자바 스크립트

$(function() { 
    setTimeout(function(){ 
     $("#loading").remove()},8000); 
     $(".left_links").click(function(e) { 
     $(".contents_div").hide(); 
     var activeDivId = $(this).attr("id") + "_div"; 
     $("#" + activeDivId).show(); 
     window.mlPushMenu._resetMenu(); 
    }); 
}); 

누구든지 나를 도울 수? 이

$(function() { 
    $('button').click(function() { 
     setTimeout(function(){ 
     $("#loading").remove()},8000); 
    }); 
    $(".left_links").click(function(e) { 
     $(".contents_div").hide(); 
     var activeDivId = $(this).attr("id") + "_div"; 
     $("#" + activeDivId).show(); 
     window.mlPushMenu._resetMenu(); 
    }); 
}); 

같은 버튼에 의해

는

Answer 1

핸들을 단추를 클릭 할 경우에만 실행됩니다 코드입니다.

버튼의 HTML 자체 내부의 이벤트를 처리하기 위해, HTML에서이

<button type="button" onclick="animationHandle()"> 

이 트릭을 할 것입니다 쓰기 기업이

$(function() { 
    function animationHandle() { 
     // animation code here. i.e. setTimeout code. 
    } 
}); 

물품.