3
이 페이지의 inspect 요소로 이동하여 float : right를 설정하면 이미지 미리보기를 표시하기 위해 http://cssglobe.com/lab/tooltip/02/을 사용하고 있습니다. 미리보기 이미지가 화면 뒤에 숨겨 질 창에 가장 가까운 이미지로 마우스를 가져갑니다. 나는 hover 이미지가 극한의 오른쪽과 viceversa에 있다면 왼쪽에 표시하고 싶습니다. 어떤 도움을 주셔서 감사합니다.미리보기 이미지 위에 이미지 미리보기를 표시하는 방법
아래가. 변경해야하는 것은 마우스를 두었을 처리하고 정확하게 질문을 읽어 :(나는 여전히 당신을 도울 것입니다 희망 나는 조금 다른 뭔가를 썼다
/*
* Image preview script
* powered by jQuery (http://www.jquery.com)
*
* written by Alen Grakalic (http://cssglobe.com)
*
* for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
*
*/
this.imagePreview = function(){
/* CONFIG */
xOffset = 10;
yOffset = 30;
// these 2 variable determine popup's distance from the cursor
// you might want to adjust to get the right result
/* END CONFIG */
$("a.preview").hover(function(e){
this.t = this.title;
this.title = "";
var c = (this.t != "") ? "<br/>" + this.t : "";
$("body").append("<p id='preview'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px")
.fadeIn("fast");
},
function(){
this.title = this.t;
$("#preview").remove();
});
$("a.preview").mousemove(function(e){
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px");
});
};
// starting the script on page load
$(document).ready(function(){
imagePreview();
});