Question

怎么做一个div内容超出用鼠标拉动底部边框是div高度变高？

现有两个例子截图：

鼠标放上去就是两个上下箭头表示可以上拉动或是往下拉动，以此来改变div的高度，请教大神这个是怎么做出来的
我的这个是内容超出后自动隐藏内容，然后不出现滚动条，当拉动底部边框的时候div层高度变化，然后内容根据高度的变化来决定哪些显示出来，div层的初始最小高度是400px





Answer 1

这用了拖拽的原理，垂直拖拽，用所拖拽的即悬浮出现上下箭头的块拖拽位置的变动来改变上边文字容器的高度

追问

对对，就是拖拽，就像那些编辑器一样可以改变大小，可以横向拖拽或是竖向，还可以斜向拖拽来改变宽和高，但是这个具体怎么实现呢？有没有什么可以参考的代码呢，我在网上搜了半天也没搜到了

追答

给你个拖拽代码

var $div=$('div'),
                           disX=0,
                           disY=0;
                       
                       $div.mousedown(function(e){
                           disX=e.pageX-$(this).offset().left;
                           disY=e.pageY-$(this).offset().top;
                           
                           $(document).mousemove(function(e){
                               $div.get(0).style.left=e.pageX-disX+'px';
                               $div.get(0).style.top=e.pageY-disY+'px';
                           });
                           
                           $(document).mouseup(function(){
                               $(document).unbind('mousemove');
                           });
                           
                           return false;
                       });

Answer 2

你可以不设置div的高度让其自动，但是这个貌似有边框，你可以试试js

追问

我设了最小高度的，超出了可以拖拽显示了，js是怎么实现的呢