<body>
<h1 id='hp'>HP: 3</h1>
<div class='background'>
<img id='drone' src="drone.png" alt="drone">
<img id='spit' src="spit.png" alt="spit">
<img id='bunker' src="bunker.png" alt="bunker">
</div>
<script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous"></script>
<script>
var hp = 3;
$('#drone').click(function() {
$('#spit').fadeIn();
$('#spit').animate({'left': '+=250px'});
$('#spit').fadeOut(function(){
hp = hp - 1;
$('#hp').text('HP: ' + hp);
if (hp == 0) {
$('#bunker').fadeOut();
}
});
$('#spit').css({left: 150}); //침 원래 자리로 이동
});
</script>
</body>
👩💻안녕하세요🌞