js 實現點擊看大圖

  顯示函數
<script language=javascript>
    
        function over(Name)
        {
            var id=Name+"div";
            var id2=Name+"img";
            var tbname=Name+"table"
            var con=document.getElementById(id);
            var con1=document.getElementById(Name);
            con.style.display="block";
            var tbobj = document.getElementById(tbname);
            var pos = getPos(tbobj);
            var con2=document.getElementById(id2)
            //con.style.pixelLeft = con1.offsetLeft + pos.x+con1.offsetWidth-con2.offsetWidth;
            //con.style.pixelTop = con1.offsetTop + pos.y;
        }
        function out(obj)
        {
            obj.style.display="none";
        }
</script>

大圖顯示
<table width="100%" height="317" border="0" cellpadding="0" cellspacing="0">
                  
                  <tr>
                    <td><img border="0" src="<%=rs("img1")%>" height="279" width="279" />
                    <div style="position:absolute;display:none;background-color:#CC3300; left:288px; top:255px;" id="img1div"><img id="img1img" src="<%=rs("img1")%>" height="279" width="279" /></div>
                    <div style="position:absolute;display:none;background-color:#CC3300; left:288px; top:255px;" id="img2div"><img id="img2img" src="<%=rs("img2")%>" height="279" width="279" /></div>
                    <div style="position:absolute;display:none;background-color:#CC3300; left:288px; top:255px;" id="img3div"><img id="img3img" src="<%=rs("img3")%>" height="279" width="279" /></div></td>
                  </tr>
                  <tr>
                    <td height="20">&nbsp;</td>
                  </tr>
                </table>

點擊小圖
<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
                          
                          <tr>
                            <td><img border="0" src="<%=rs("img1")%>" height="74" onmouseover="over('img1')" onMouseOut="out(img1div)" /></td>
                            <td><img border="0" src="<%=rs("img2")%>" height="74" onmouseover="over('img2')" onMouseOut="out(img2div)" /></td>
                            <td><img border="0" src="<%=rs("img3")%>" height="74" onmouseover="over('img3')" onMouseOut="out(img3div)" /></td>
                          </tr>
                          
                        </table>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章