如何创建以固定位置开始的浮动标记?

时间:2012-11-01 23:38:04

标签: jquery html draggable

我想创建一个关于width = 200px和height = 100px的小DIV,并使它有点透明。

DIV需要超越图片。我希望客户能够在屏幕上的任何位置拖动DIV。

在初始页面加载时,我需要将DIV置于相同的固定位置才能启动。

有没有人有任何jquery脚本会这样做?

谢谢你。

埃里克

1 个答案:

答案 0 :(得分:0)

这很古怪,但可能会给你一个简单的开始。希望其他人可以投入! :)

JSFiddle http://jsfiddle.net/V3TQ9/

CSS(我没有添加透明度)

<style type="text/css">

    #moveit {
    width:200px;
    height:50px;
    position:absolute;
    left:0px;
    top:0px;
    z-index:100;
    background-color:#666666;
    display:block;
}

</style>

HTML

<div id="moveit"></div>

JQuery的

<script type="text/javascript">

$('#moveit').mouseup(function(e){ 

        $('#moveit').css({ left : (e.pageX - 100) , top : (e.pageY - 25) });
        $('#moveit').off('mousemove');

}).mousedown(function(){  

        $('#moveit').on('mousemove', function(e){       
            $('#moveit').css({ left : (e.pageX - 100) , top : (e.pageY - 25) });
        });

});

</script>