有谁知道控制层显示位置的控件的吗

我想实现拖拽层来控制层的显示位置,类型google的个性化设置,可以任意拖动,谁有控制层显示位置的控件吗?

Jquery的sortables插件

jquery插件dropanddrag

[url]http://demo.qooxdoo.org/current/portal/[/url]
自己在网上搜搜,可以找到下载链接

用jquery ui [url]http://jqueryui.com/[/url]

[code="java"]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

jQuery EasyUI
<script type="text/javascript" src="../jquery-1.4.4.min.js"></script>

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

<style type="text/css">

    .drag{

        width:100px;

        height:50px;

        padding:10px;

        margin:5px;

        border:1px solid #ccc;

        background:#AACCFF;

    }

    .dp{

        opacity:0.5;

        filter:alpha(opacity=50);

    }

    .over{

        background:#FBEC88;

    }

</style>

<script>

    $(function(){

        $('.drag').draggable({

            proxy:'clone',

            revert:true,

            cursor:'auto',

            onStartDrag:function(){

                $(this).draggable('options').cursor='not-allowed';

                $(this).draggable('proxy').addClass('dp');

            },

            onStopDrag:function(){

                $(this).draggable('options').cursor='auto';

            }

        });

        $('#target').droppable({

            accept:'#d1,#d3',

            onDragEnter:function(e,source){

                $(source).draggable('options').cursor='auto';

                $(source).draggable('proxy').css('border','1px solid red');

                $(this).addClass('over');

            },

            onDragLeave:function(e,source){

                $(source).draggable('options').cursor='not-allowed';

                $(source).draggable('proxy').css('border','1px solid #ccc');

                $(this).removeClass('over');

            },

            onDrop:function(e,source){

                $(this).append(source)

                $(this).removeClass('over');

            }

        });

    });

</script>

<h1>DragDrop</h1>

<div id="source" style="border:1px solid #ccc;width:300px;height:400px;float:left;margin:5px;">

    drag me!

    <div id="d1" class="drag">Drag 1</div>

    <div id="d2" class="drag">Drag 2</div>

    <div id="d3" class="drag">Drag 3</div>

</div>

<div id="target" style="border:1px solid #ccc;width:300px;height:400px;float:left;margin:5px;">

    drop here!

</div>


[/code]

建议也看看 jquery easyui的 droppable ,如此建议的代码即可实现你的要求。

这个用js也可以实现。

具体实现方法你上网能找到