使用CSS使Div可拖动 [英] Make Div Draggable using CSS

问题描述

我想让id为drag_me的div标签可拖动长度从左到右300px，从顶部到460px，只能使用CSS。

我也想让它可以调整大小。

任何人都可以为此提出解决方案......

感谢所有人提供的解决方案

解决方案

HTML：

 < div draggable =trueclass = 调整大小 >< / DIV> 
  

CSS：

  [draggable = true] {
 cursor：move; 
} 
 
 .resizable {
 overflow：scroll; 
 resize：both; 
 max-width：300px; 
最大高度：460px; 
} 
  

Demo

• 在HTML5 Rocks上的可拖动属性


• CSS resize MDN上的财产

I want to make my div tag with id "drag_me" to be draggable up to the length of 300px from left and 460px from top, only using CSS.

I also want to make it resizable. Again same condition as above i.e. no Javascript or jquery.

Can any one suggest the solution for this...

Thanks in advance to all

解决方案

This is the best you can do without JS:

HTML:

<div draggable="true" class="resizable"></div>

CSS:

[draggable=true] {
    cursor: move;
}

.resizable {
    overflow: scroll;
    resize: both;
    max-width: 300px;
    max-height: 460px;
}

Demo

• draggable attribute on HTML5 Rocks
• CSS resize property on MDN

这篇关于使用CSS使Div可拖动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！