点击弹窗我这个弹窗的拖拽很是卡是什么东西引起的?

jq拖拽问题

3 个回答

得票最新

对角另一面

1.4k72438

发布于
2016-04-15

用了transition吧

max0x0042

1.4k1112

发布于
2016-04-15

建议用css来做。
参考文章：CSS vs JS动画：谁更快？

golden_freeman_china

1.8k1211

发布于
2016-04-15

拿去玩~PS：

$(function(){
                $(function(){
                    $('.popbox').click(function(){
                        $(this).popbox({
                            popobj:'.content',
                            drag:true
                        })    
                    })
                })
            })

这段...............................什么意思》？

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="./jquery.js"></script>
        <style type="text/css">
            body,
            html {
                margin: 0;
                padding: 0;
                position: relative;
                height: 100%;
                width: 100%;
            }
            
            .openpop {
                background-color: red;
                display: block;
                width: 200px;
                height: 200px;
                position: absolute;
                top: 0;
                left: 0;
                bottom: 0;
                right: 0;
                margin: 0 auto;
            }

        </style>
    </head>

    <body>
        <div class="openpop"></div>
    </body>

    <script type="text/javascript">
        $(function() {
            $.fn.drag = function(options) {
                var defaults = {
                    handler: false,
                    opacity: 0.5
                };
                var opts = $.extend(defaults, options);
                this.each(function() {
                    var isMove = false,
                        handler = opts.handler ? $(this).find(opts.handler) : $(this),
                        _this = $(this),
                        dx, dy;
                    $(document).mousemove(function(event) {
                        if (isMove) {
                            var eX = event.pageX,
                                eY = event.pageY;
                            _this.css({
                                'left': eX - dx,
                                'top': eY - dy
                            });
                        }
                    }).mouseup(function() {
                        isMove = false;
                        _this.fadeTo('fast', 1);
                    });
                    handler.mousedown(function(event) {
                        if ($(event.target).is(handler)) {
                            isMove = true;
                            $(this).css('cursor', 'move');
                            _this.fadeTo('fast', opts.opacity);
                            dx = event.pageX - parseInt(_this.css("left"));
                            dy = event.pageY - parseInt(_this.css("top"));
                        }
                    });
                });
            };

            $(".openpop").drag({
                opacity: 0.7
            });
        })

    </script>

</html>

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

jq拖拽问题

你尚未登录，登录后可以

为什么相同的代码无法正确排列数据？

像下面这样的jquery是在哪一步实现数据的双向绑定的呢？

多行表格中jquery的选择器为什么会出现无法选中dom的情况？