我看过很多东西,包括如何制作一个调整 a 大小的“grippie” textarea
,并尝试了所有代码,但没有一个有效。有什么帮助吗?当您提出问题或发布答案时,我试图让它像 Stack Overflow 上的一样。
问问题
645 次
2 回答
3
我发现了怎么做!!这是该项目的一个小提琴。我会继续更新它,让它变得更好!
HTML
<textarea id="textarea"></textarea>
<div id="grippie" draggable="false"></div>
QJuery/JavaScript
var resize = false;
$('#textarea').hover(function(e){
e.preventDefault();
resize = false;
});
$('#grippie').mousemove(function(e){
if(resize == true){
$('#textarea').height(e.pageY-18);
}
});
$('#grippie').mousedown(function(e){
resize = false;
resize = true;
});
$(window).mouseup(function(e){
resize = false;
});
CSS
#textarea {
padding: 2px;
width: 400px;
height: 200px;
min-height: 50px;
overflow: auto;
resize: none;
}
#grippie {
display: block;
width: 404px;
height: 5px;
background-color: #CCC;
border: 1px solid #888;
cursor: s-resize;
}
于 2016-06-09T23:01:49.923 回答
1
控制网页上的堆叠
你有两个 div
<div id="div1" class="bottom-layer"><textarea></textarea></div>
<div id="div2" class="top-layer"><img id="grippie" src="grippie.png" draggable="true" class="grippie-thingy"/></div>
使用 ondragstart 连接手柄
$('#grippie').on('dragstart', function(evt) {
})
如果用户单击顶层而不是文本区域上的抓手 setfocus
于 2016-06-09T21:33:20.620 回答