<div style="display:none;position:absolute;border-style:solid;border-color:blue;border-width:1;background-color:White" id="divDetails">
     <p>姓名:<span id="spanUserName"></span></p>
     <p>年龄:<span id="spanAge"></span></p>
    </div> <script type="text/javascript">
            $("img").mouseover(function (e) {
                $("#spanUserName").text($(this).attr("a1"));
                $("#spanAge").text($(this).attr("a2"));
                $("#divDetails").css("top", e.pageY).css("left", e.pageX).show("slow");
            });
            $("img").mouseout(function (e) {
                $("#divDetails").hide();
            });
           
        </script>   
 <asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1">
        <HeaderTemplate><table><tr></HeaderTemplate>
        <ItemTemplate><td><img  a1='<%#Eval("UserName") %>' a2='<%#Eval("Age") %>'  width="150px" height="100px" src='images/<%#Eval("PicPath") %>' alt='<%#Eval("PicPath") %>' /></td></ItemTemplate>
        <FooterTemplate></tr></table></FooterTemplate>
        </asp:Repeater>
这些代码是实现了鼠标经过图片的时候,显示层并层里面显示一些相关信息,鼠标离开图片后,层会隐藏掉。
问题是,我想实现鼠标经过层(即离开图片)的时候,层不会隐藏,而是还能显示(让用户有时能复制粘贴层里面的信息)。不知道怎样实现呢.
分不多,也希望大家帮帮忙

解决方案 »

  1.   

    over移入显示,一移动可能认为离开
    move移入并移动
      

  2.   

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>无标题页</title>
        <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
        <script type="text/javascript">
         $(document).ready(function(){
            $("#show").mouseover(function(e){
                e=e||window.event;
                $("#spanUserName").text("aaaa");
                $("#spanAge").text("bbbb");
                $("#divDetails").css({"display":"block","top":e.clientY,"left":e.clientX});
            })
            $(document).mousemove(function(e){
                e=e||window.event;
                var target = e.target||e.srcElement;
                while(target.parentNode&&target.tagName!="DIV"&&target.id!="divDetails")
                    target=target.parentNode;
                if(target.id!="show"&&target.id!="divDetails")
                    $("#divDetails").css("display","none");
            })
            
         })
        </script>
    </head>
    <body>
    <div style="display:none;position:absolute;border-style:solid; border-color:blue;border-width:1;z-index:3; background:white;width:100px;height:100px;" id="divDetails">
         <p style="background:white">姓名:<span id="spanUserName"></span></p>
         <p style="background:white">年龄:<span id="spanAge"></span></p>
    </div>
    <div id="show" style="width:300px;height:300px;background:red">
        
    </div>
    </body>
    </html>