본문으로 바로가기

다른영역 클릭시 팝업 닫기

category WEB/jQuery 2017. 3. 30. 12:03
<a href="javascript:;" class="share"><i class="fa fa-share-alt" aria-hidden="true"></i></a>
<div class="share-pop">
<ul>
<li><a href="javascript:;"><i class="fa fa-facebook-square" aria-hidden="true"></i></a></li>
<li><a href="javascript:;"><i class="fa fa-twitter-square" aria-hidden="true"></i></a></li>
<li><a href="javascript:;"><i class="fa fa-facebook-square" aria-hidden="true"></i></a></li>
<li><a href="javascript:;"><i class="fa fa-twitter-square" aria-hidden="true"></i></a></li>
<li><a href="javascript:;"><i class="fa fa-facebook-square" aria-hidden="true"></i></a></li>
</ul>
</div>

//공유하기 클릭
$(".share").click(function(){
$(".share-pop").stop().fadeToggle(500);
return false; //중요
});
//공유하기 팝업 외에 영역 클릭
$(document).click(function(e){ //문서 body를 클릭했을때
if(e.target.className =="share-pop"){return false} //내가 클릭한 요소(target)를 기준으로 상위요소에 .share-pop이 없으면 (갯수가 0이라면)
$(".share-pop").stop().fadeOut(500);
});


'WEB > jQuery' 카테고리의 다른 글

$(window).load, $(document).ready 로드 후 실행되는 시간  (0) 2017.06.07
레이어 팝업 뒤에 스크롤 막는 방법  (0) 2017.05.09
플로팅 배너 응용  (0) 2017.03.22
checkbox 전체 선택  (0) 2017.03.15
Top Button  (0) 2017.02.27