ASP.NET C＃如何擴大GridView的DataBound imageField圖片時，如何？

我正在學習工作，需要一些幫助，我希望圖像在DataBound的'相關信息'ImageField列中可以放大。這裏是我的代碼：ASP.NET C＃如何擴大GridView的DataBound imageField圖片時，如何？

<div style="height:200px; width: 610px; overflow: auto;"> 
       <asp:GridView ID="GV_insView" runat="server" 
      AutoGenerateColumns="False" 
      CssClass="Grid" AlternatingRowStyle-CssClass="alt" Width="511px"> 
<AlternatingRowStyle CssClass="alt"></AlternatingRowStyle> 
      <Columns> 
       <asp:BoundField HeaderText="Customer ID" DataField="NRIC" /> 
       <asp:BoundField HeaderText="Insurance Type" DataField="insType" /> 
       <asp:BoundField HeaderText="Date Filed" DataField="dateFiled" DataFormatString="{0:dd/MM/yyyy}"/> 
      <asp:ImageField HeaderText="Relevant Information" DataImageUrlField="relInfo" ControlStyle-Width="100" ControlStyle-Height="100"> 
       </asp:ImageField> 
      </Columns> 
     </asp:gridview> 
        </div>

來源

2016-07-28 shck

你必須編寫自定義JavaScript函數和CSS來支持它。

請找到下面的示例代碼，瞭解如何執行此操作。

<script type="text/javascript"> 
    $(function() { 
     $("[id*=GridView1] td").hover(function() { 
      $("td", $(this).closest("tr")).addClass("hover_row"); 
     },function(){ 
      $("td", $(this).closest("tr")).removeClass("hover_row"); 
     }); 
    }); 
</script>

和您將使用CSS3屬性的CSS轉換縮放比例來放大懸停。

<style type="text/css"> 
    body 
    { 
     font-family: Arial; 
     font-size: 10pt; 
    } 
    td 
    { 

    } 
    .hover_row 
    { 
     -ms-transform: scale(2, 3); /* IE 9 */ 
     -webkit-transform: scale(2, 3); /* Safari */ 
     transform: scale(2, 3); 
    } 
</style>

有關完整的解決方案，你可以檢查這個鏈接，這是上述信息的來源。 Change row color on GridView Hover ASP Snippets

對於只有一個綁定字段有一些特定的CSS，你可以試試這個。

<asp:BoundField DataField="Count" HeaderText="Count"> 
    <ItemStyle CssClass="yourclass"></ItemStyle> 
</asp:BoundField>

這樣，圖像的所有boundfields都會獲得CSS類的懸停。

希望這會有所幫助。

來源

2016-07-28 11:19:04 Waqar

感謝您的迴應，代碼工作，我現在可以放大GridView中的內容。但是，當我將鼠標懸停在圖像上時，所有其他列中的單詞也會放大。有任何解決這個問題的方法嗎？ – shck

僅適用於所選的行。你可以做什麼來把這個CSS屬性放到那個特定的綁定域。 – Waqar

你可以檢查我的答案的編輯 – Waqar

ASP.NET C＃如何擴大GridView的DataBound imageField圖片時，如何？

回答

相關問題