asp.net下用js實(shí)現(xiàn)鼠標(biāo)移至小圖，自動(dòng)顯示相應(yīng)大圖

2024-07-10 12:40:25

字體：大中小

供稿：網(wǎng)友

實(shí)現(xiàn)根據(jù)后臺(tái)綁定小圖片，鼠標(biāo)移至小圖，自動(dòng)顯示相應(yīng)大圖

.Net精簡(jiǎn)版本

<script language="JavaScript">
   function GetShowImg(imgfile)
   {
    document.all("ShowImage").src = "/semir/images/"+ imgfile;

   }
  </script>
//DataList綁定
<asp:datalist id="DlSides" runat="server" OnItemCommand="DlSides_ItemCommand" RepeatDirection="Horizontal"
      RepeatColumns="3" DataKeyField="SideID" CssClass="semirText">
      <ItemTemplate>
       <a onmouseover="GetShowImg('<%# DataBinder.Eval(Container.DataItem, "sidePath")%>')"><IMG style="WIDTH: 45px; HEIGHT: 56px" alt="" src='/semir/images/small<%# DataBinder.Eval(Container.DataItem, "sidePath")%>' border=0 ></a>
                </ItemTemplate>
     </asp:datalist>

// 顯示相應(yīng)大圖
<img name="ShowImage">

ASP完整版

<script language="JavaScript">
    function ImagePreload()
    {
    var args = ImagePreload.arguments;
    document.ImgPreArray = new Array(args.length);
    for(var i=0; i<args.length; i++)
    {
    document.ImgPreArray[i] = new Image;
    document.ImgPreArray[i].src = "admin/upfile/newbook/"+ args[i];
    }
    }
     function fitSize() {
      var a, b;
      var imgobj = document.all("ShowImage");
      var oldimg = new Image();
      oldimg.src = imgobj.src;
      var dw = oldimg.width;
      var dh = oldimg.height;

上一篇：數(shù)據(jù)庫(kù)開(kāi)發(fā)總結(jié)(ADO.NET小結(jié))

下一篇：ASP.Net全局變量的設(shè)置和讀取方法