jquery 팝업으로 마우스를 올리면 <a>으로 변경해야합니다. <label>

Question

링크 위로 마우스를 가져 가면 이미지가 표시되는 팝업 시스템이 있습니다.

<a style="" class="screenshot" rel="images/0.jpg" title="blablabla">blablabla</a> 

내가 시도 : 당신이 <label> 이상

popup.js 여기

/* 
* Url 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.screenshotPreview = function(){  
    /* CONFIG */ 

     xOffset = 130; 
     yOffset = 60; 

     // these 2 variable determine popup's distance from the cursor 
     // you might want to adjust to get the right result 

    /* END CONFIG */ 
    $("a.screenshot").hover(function(e){ 
     this.t = this.title; 
     this.title = "";  
     var c = (this.t != "") ? "<br/>" + this.t : ""; 
     $("body").append("<p id='screenshot'><img src='"+ this.rel +"' alt='image loading...' />"+ c +"</p>");        
     $("#screenshot") 
      .css("top",(e.pageY - xOffset) + "px") 
      .css("left",(e.pageX + yOffset) + "px") 
      .fadeIn("fast");       
    }, 
    function(){ 
     this.title = this.t;  
     $("#screenshot").remove(); 
    }); 
    $("a.screenshot").mousemove(function(e){ 
     $("#screenshot") 
      .css("top",(e.pageY - xOffset) + "px") 
      .css("left",(e.pageX + yOffset) + "px"); 
    });   
}; 


// starting the script on page load 
$(document).ready(function(){ 
    screenshotPreview(); 
}); 

를 가져 가면 대신에 나는 팝업이 활성화 될

는 HTML 팝업을 활성화 HTML입니다 필요 :

<label for="0" class="screenshot" rel="images/0.jpg" title="blablabla">blablabla</label> JS $("label.screenshot").hover,하지만 난 단지 ..

Answer 1

당신이 겪고있는 문제를 이미지 로딩없이 이미지를 얻을, this.rel부터 제대로 a 태그 아니지만의 속성 인 DOM 속성 rel에 액세스하는 것입니다에 label.

코드를 $(this).attr('rel')으로 변경하면 속성으로 변경됩니다.

$("body").append("<p id='screenshot'><img src='"+ $(this).attr('rel') ...