카테고리 없음

[javascript] 자바스크립트 클릭이벤트🖱, 더블클릭으로 사진 없애기

오늘의 여름 2023. 4. 10. 23:55
728x90

 

 

 

📌더블클릭으로 사진 없애기🖱

 

 

 

self_review

 

 

☝<결과>  위 사진을 더블클릭하면 사라진다.

 

 

 

<head>
    <style>
        .image{ width: 20rem;
            height: 20rem;
            display: inline;}
       
    </style>
</head>
<body>
    <div class="image">
        ondblclick="gone_fun(event)">
    </div>
   
    <script>
        let result = document.querySelector('.image');
        const gone_fun =(evnet) => {result.style.display='none'}
    </script>



</body>

<style>안에 div의 클래스 네임인 image의 display속성을 처음에 inline으로 보이게 했다가 클릭 이벤트가 발생하면 display의 style을 none으로 바꾸므로 안보이게 한다.

 

img 테그 안에 ondblclick=함수 를 넣으면 더블클릭하면 함수가 실행된다는 것이다.

 

728x90