Home  >  Q&A  >  body text

javascript - 如何添加左右div中间动态调整的分割线功能?

现在有2个p

<p id="content">
    <p id="left">
    <p id="right">
</p>

我想在left和right之间添加一条分割线,可以左右拖动,动态改变两边p的宽度,两个p宽度加起来始终是填充满父元素的宽度。
目前只找到Jquery ui 的resizable组件,我是给left-p添加了很小的一个margin-right用作看起来粗点的分割线,然后设置left的e可拖动,调整宽度的时候重新计算两边p的宽度,最后CSS设置。
这样有两个问题:

1.我左右拉动分割线的时候,速度稍微快点,这个分割线会变的很粗,效果非常差
2.改变左右p的宽度是通过resize事件来控制,动态计算宽度,然后用css()设置的,这样应该性能非常低吧。
请问,还有什么好的办法,或者改进的建议?
黄舟黄舟2726 days ago341

reply all(2)I'll reply

  • 高洛峰

    高洛峰2017-04-10 17:50:59

    frame可以吗?

    reply
    0
  • 天蓬老师

    天蓬老师2017-04-10 17:50:59

    代码有点乱 可以自己整理一下 代码量不大
    http://codepen.io/hj624608494...

    reply
    0
  • Cancelreply