2017-05-10 8 views
-1

Magnificient 팝업을 사용하여 이미지 제품 핫 포인트를위한 방법으로 제품 페이지를 방문합니다. 핫 포인트를 클릭하면 큰 이미지와 텍스트로 팝업이 나타납니다. 마우스 오버시 팝업을 열어 달라는 요청을 받았습니다.Magnificent popup - 마우스 오버시 열리는 방법?

마우스를 클릭하지 않고 마우스 오버에서 Magnificent Popup을 실행하는 방법이 있습니까? 링크에서 mouseover 이벤트를 먼저 호출하려고했지만 Popup에 클릭이 필요합니다. 마우스 오버만으로 열리도록 만드는 방법은 무엇입니까?

<!-- Popup link --> 
<a href="#test-popup" class="open-popup-link">Show inline popup</a> 

<!-- Popup itself --> 
<div id="test-popup" class="white-popup mfp-hide"> 
    Popup content 
</div> 

자바 스크립트 :

$('.open-popup-link').mouseover(function(){ 
    $(this).magnificPopup({ 
    type: 'inline' 
    }); 
}); 
+0

BTW : https://codepen.io/pen/ZKrVNK

이벤트 위임을 사용하여 갤러리의 별도의 슬라이드를 열고 여러 개의 링크로 추가 복용을 아무런 설명도없이 질문. – irina

답변

1

내 자신의 질문에 대답. 조금 더 조사한 후에 API를 통해 직접 팝업을 열어야한다는 것을 알았습니다. 이제 작동합니다

$('.open-popup-link').mouseover(function(){ 
    $.magnificPopup.open({ 
    items: { 
    src: '.white-popup' // can be a HTML string, jQuery object, or CSS selector 
    } 
    }) 
}); 

근무 예 : 좀 다른 사람이 다운 그레이드 있음을 냉각하지 http://codepen.io/pen/EmEOMa

+0

답변이 도움이되었습니다. 감사합니다. –