동영상 플레이버튼 질문드립니다.

<div class="video_area">
				<video id="myVideo" poster="img/cover.jpg" width="100%">
                     <source src="img/video_1.mp4" type="video/mp4">
                </video>
                 
				<div class="buttons">
                   <button class="uk-button uk-button-primary second" onclick="pauseVid()" type="button">
                   <i class="fas fa-pause"></i></button>
                   <button class="uk-button uk-button-primary first" onclick="playVid()" type="button">
                   <i class="fas fa-play"></i></button>
                </div>

				<script>
                    var vidClip = document.getElementById("myVideo"); 
					  function playVid() { 
						  myVideo.play();
						  } 
						  function pauseVid() { 
							  myVideo.pause(); 
							  }
							  
						 $('button').on('click', function() {
							 $('.first, .second').toggle();
							 }); 
							 
							 vidClip.onended = function(e) {
								 $('.first, .second').toggle();
								 };
				</script>
		    </div>

안녕하세요.

비디오 재생버튼/일시정지버튼 관련 스크립트를 넣었는데
비디오 영역에서 벗어났을 때 일시정지 버튼이 사라지게 하고
다시 비디오 영역에 위치했을 때 재생버튼이 나타나게 하고싶습니다 ㅠㅠ

도와주세여 ㅠㅠ

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기