很多人不知道jquery-ui怎样实现拖拽效果 ,下面小编和大家一起来看看怎么操作:

工具/原料

  • 联想 威6
  • win10 20H2
  • jquery-ui12.2.2

方法/步骤

  1. 1

    在HTML中界面引入jquery和jquery-ui,注意jquery一定要jquery-ui前面,不然会报错,无法实现想要的效果。

  2. 2

    然后给div嵌套一个div,并且添加id,结构如图所示。我就给div添加了f和s的id。

  3. 3

    然后设置f的style样式效果,给它添加一个边框即可。

  4. 4

    如图,这就是f的预览效果图。

  5. 5

    然后再设置一下s的style样式,大小不要超过之前的f,设置背景色为红色。

  6. 6

    如图,基本样式都写完了。默认情况下,元素是没有拖拽效果的,接着我们开始给红色的div添加拖拽效果。

    END

注意事项

  • 如果遇到问题,可以在下面提出疑问。
经验内容仅供参考,如果您需解决具体问题(尤其法律、医学等领域),建议您详细咨询相关领域专业人士。