호버로 이미지를 팝업하는 방법은 무엇입니까?

Question

내 페이지는 더 많은 열과 행을 포함하는 테이블을 가지고 있으며 행과 열은 작은 이미지를 가지고 있습니다. for 루프는 images.i를 호출 할 때 이미지를 가리 키려고합니다. 미리 감사드립니다. 가능합니까?

Answer 1

예 가능합니다. http://api.jquery.com/mouseover/

그리고 magnific 팝업과 같은 팝업 플러그인 : http://dimsemenov.com/plugins/magnific-popup/

Answer 2

내가 여기 이런 걸 상상할 수 : JQuery와 마우스 오버 이벤트와

$(".image").hover(function(){ 
    //display bigger image here 
}, function() { 
    //hide it here 
}); 

대안을, 당신은 CSS :hover

을 사용할 수 있습니다

Answer 3

단순 jquery hover function을 다음과 같이 사용할 수 있습니다

$('img').hover(function(){ 

    $(this).css('width' , '500px'); 
    $(this).css('height' , '500px'); 
},function(){ 

    $(this).css('width' , '200px'); 
    $(this).css('height' , '200px'); 
}) 

이 이미지의 HTML 코드입니다

<div id="main_container"> 
    <div id="div1"> 
     <img src="img/angelinasmall.jpg" style="width: 200px; height: 200px;" /> 
    </div> 
    <div id="div2"> 
     <img src="img/hayden.jpg" style="width: 200px; height: 200px;" /> 
    </div> 
    <div id="div3"> 
     <img src="img/milla.jpg" style="width: 200px; height: 200px;"/> 
    </div> 
</div> 

Answer 4

$ ("몸"). ('마우스 오버', '#의 image_id', 기능() {

// 팝업에 영상.

});