鼠標懸停在gridview行顯示圖像

Question

我有一個asp.net gridview.For每一行gridview，我有一個圖像列。 在鼠標懸停的那一欄中，我需要在大尺寸上顯示圖像，就像我們在css中使用onmouseover效果一樣。

請幫我這個。

Answer 1

你可以有一個絕對定位的集合，並顯示爲無。

<div id="imgContainer" style="position:absolute;display:none;" /> 

然後，在JavaScript

//Assuming you only have images in the image column 
//If you have images in other columns just set a class on the column of the images 
// so you can select it with jquery. 
// tableid is the id of your table. Like <%=[idofgridview].ClientID%> 
$("#tableid img").hover(function f(){ 
    //set position of the hidden div 
    $("#imgContainer").position($(this).position().left, $(this).position().top); 
    //put the image in the hidden div 
    $("#imgContainer").append("<img src="+$(this).attr("src")+"/>"); 
    //assuming the image is full size in the table and just made smaller using css 
    //show the image. 
    $("#imgContainer").show(); 

}, 
function() { 
    //hide the div with fullsize image 
    $("#imgContainer").hide(); 
    //clear out the html from the div 
    $("#imgContainer").html(""); 
} 
);