`

jquery 移动层

    博客分类：
  • java
 
阅读更多

<%@ page language="java" contentType="text/html;charset=GBK"%>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>移动层</title>

<script type="text/javascript" src="../jquery/jquery-1.7.2.min.js"></script>

<script type="text/javascript">

(function($){

  $.fn.draggable=function(s){

   if(this.size()>1) return this.each(function(i,o){$(o).draggable(s)});

   var t=this,h=s?t.find(s):t,m={},to=false,

       d=function(v){

     v.stopPropagation();

     m={ex:v.clientX,ey:v.clientY,x:t.css("position")=="relative"?parseInt(t.css("left")):t.position().left,y:t.css("position")=="relative"?parseInt(t.css("top")):t.position().top,fw:t.get(0).style.width,w:t.width()};

     if(t.css("position")=="static") to={"left":m.x,"top":m.y};

     $(document).mousemove(b).mouseup(e);

        if(document.body.setCapture) document.body.setCapture(); 

     debug(m)

     },

    b=function(v){t.css({"left":v.clientX-m.ex+m.x,"top":v.clientY-m.ey+m.y});},

    e=function(v){

        if(document.body.releaseCapture) document.body.releaseCapture();

     $(document).unbind("mousemove").unbind("mouseup");

     };

    h.mousedown(d);

    return t;

   };

})(jQuery);

$(document).ready(function(){ 

 $(".showmessage").draggable();

})

function debug(m){

 //打印出对象所在页面的具体位置

 document.title="ex="+m.ex+" ey="+m.ey+" x="+m.x+" y="+m.y+" fw="+m.fw+" w="+m.w;

}

</script>

<style>

.showmessage { position:absolute;top:250px;left:25px;z-index:999;width:400px;height:180px; background:#CCC;cursor:move; }

</style>

</head>

<body>

<div style="position:relative">

 <div class="showmessage">

       <table>

            <tr height="30px">

             <td class="pl20">买家留言：</td>

                <td class="tar pr10"><span class="close_infomation">X</span></td>

            </tr>

            <tr height="130px">

             <td class="pl20" colspan="2">

                 <textarea style="height:130px;width:375px"></textarea>

                </td>

            </tr>

        </table>

 </div>

</div>

</body>

</html>

分享到：
| Exception starting filter Struts2 Caught ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics