用CSS也可以的,仅供参考.hoverbox
{
cursor: default;
list-style: none;
}.hoverbox a
{
cursor: default;
border-bottom : 0px solid #fcb9b9;
}
.hoverbox a .preview
{
display: none;
}.hoverbox a:hover .preview
{
display: block;
position: absolute;
top: -33px;
left: -100px;
z-index: 101;
}.hoverbox img
{
background: #fff;
border-color: #FCB9B9;
border-style: solid;
border-width: 1px;
color: inherit;
padding: 5px;
vertical-align: top;
width: 100px;
height: 75px;
}.hoverbox li
{
color: inherit;
display: inline;
float: left;
margin: 3px;
padding: 5px;
position: relative;
}.hoverbox .preview
{
border-color: #9E9B9A;
width: 300px;
height: 225px;
}

解决方案 »

  1.   

    我是在.net里面调用的,我刚试了。没什么效果噢
      

  2.   

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>无标题页</title>
        <script language="javascript" type="text/javascript">
            function ShowPreview()
            {
                var bigPicture = window.document.getElementById("picView");
                bigPicture.style.display="block";
            }
            function HidePreview()
            {
                window.document.getElementById("picView").style.display="none";
            }
        </script>
    </head>
    <body>
        <div style="z-index:0;">
            <table>
                <tr>
                    <td><img id="smallPicture" style=" left:100px; top:50px; z-index:0;" src="ss/b.jpg" alt="" onmouseover="ShowPreview('smallPicture')" onmouseout="HidePreview()" /></td>
                    <td>商品介绍</td>
                </tr>
                
            </table>
            
        </div>
        <div id="picView" style="position:absolute; z-index:1; display:none;" >
            <img id="bigPicture" src="ss/a.jpg" alt="" />
        </div>
    </body>
    </html>
      

  3.   

    有没有更好的,如果采用这样的方法,那么是不是每次装载页面会不会很慢,如果图片大点,不要说多了。不好意思 说风凉话了,不过建议还是动态加载图片的好,也就是通过ajax向服务器发送请求,服务器会返回相应图片的路径,然后将它插入到指定的div中显示就行了。