Skip to content

在页面存在iframe的情况下,dom.draggable的拖拽动作可能停不下来 #220

@songao

Description

@songao

issue说明

在Chrome中,页面中有iframe存在的情况下,拖拽draggable块以较快速度移入iframe范围内,并立即松开鼠标,此时会出现draggable块一直跟随鼠标,怎么也停不下来。发生的原因是iframe捕捉的mouseup事件,不再向其父级页面传递,导致drag动作没有终止。

下面是复现的测试代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>drag</title>
<script type="text/javascript" src="http://tangram.baidu.com/download/tangram-1.3.9.js"></script>
<style type="text/css">
.container{
    float:left; padding-left:50px;
}
.drag-wrap{
    width:300px; height:220px; background:#8888FF; position:relative;
}
.drag-title{
    background:#666666; height:20px; line-height:20px; color:white; cursor:move;
}
</style>
</head>

<body>
<div class="container">
    <div id="widget" class="drag-wrap">
        <div id="title" class="drag-title">drag me</div>
        <div>在页面中有iframe存在的情况下,拖拽draggable块以较快速度移入iframe范围内,并立即松开鼠标,此时会出现draggable块一直跟随鼠标,怎么也停不下来</div>
    </div>
</div>
<iframe src="http://www.google.com.hk" width="500" height="500" frameborder="1"></iframe>
<script type="text/javascript">
baidu.dom.draggable('widget', {
    handler : 'title'
});
</script>
</body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions