首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >jQuery:获取HTML5放置的位置

jQuery:获取HTML5放置的位置
EN

Stack Overflow用户
提问于 2018-07-06 03:56:04
回答 1查看 46关注 0票数 3

我正在制作一个带有标签窗格的web应用程序。为了在标签窗格和其他窗口中移动标签,我使用原生HTML拖放。

要在选项卡窗格中移动选项卡,用户可以将一个选项卡拖到另一个选项卡上,然后该选项卡将根据它在选项卡上被拖动的位置将其放在左侧或右侧。我不确定如何找到标签放在另一个标签上的位置。

代码语言:javascript
复制
$(document).on('dragstart', '.tabpane li', function(e) {
  ...
});

$(document).on('dragover', '.tabpane li', function(e) {
  e.preventDefault();
});

$(document).on('drop', '.tabpane li', function(e) {
  var droppedOnTabAt = ? ? ? ; // How do I find this?

  if (droppedOnTabAt.x > $(this).width() / 2) {
    // move tab to the right of the dropped onto tab
  } else {
    // move tab to the left of the dropped onto tab
  }
});
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-07-06 11:48:42

能够通过阅读更多的documentation来解决我的问题。

代码语言:javascript
复制
$(document).on('drop', '.tabpane li', function(e) {
  var droppedOnTabAt = e.originalEvent.clientX; // Gets the x position of the drop relative to the window
  var tabMiddlePos = $(this).offset().left + $(this).width() / 2; // Gets the center of width of the tab dropped on relative to the window

  if (droppedOnTabAt > tabMiddlePos ) {
    // move tab to the right of the dropped onto tab
  } else {
    // move tab to the left of the dropped onto tab
  }
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51198956

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档