Question

我正在使用jQuery位置UI插件在网页上定位帮助器图标。这是我负责职位的代码：

    if ( $(element_selector).length !== 0 && $(title_class_selector).length !== 0  ) {

    $(title_class_selector).position({
    my: "center",
    at: cornerPosition,
    offset:"<?php echo $x_coordinates_foradjustment;?> <?php echo $y_coordinates_foradjustment;?>",
    of: $(element_selector)

    });

    }

其中cornerPosition具有以下可能值：

left top
right top
left bottom
right bottom

它工作得很好，直到我遇到特定div的问题，我想附加图标。在第一次加载时，位置是错误的（而不是左下方，它会向左上方）而另一个位于右上方，而是向右下方。

这些是受影响的element_selectors，其位置正确和错误：

#wpv-featured-news-slider .span4:first-child .thumbnail
Correct position: Left bottom
Actual position on first loading of webpage: Left top

#wpv-featured-news-slider
Correct position: Right top
Actual position on first loading of webpage: Right bottom

奇怪的是，当我刷新页面（重新加载页面）时，它现在就到了正确的位置！缓存或选择器有问题吗？有没有办法在此添加一些检查？我不想更改element_selectors来纠正这个问题。

这个定位系统已在我们不同的网站上广泛实施，这是我遇到这个问题的唯一场合（其余部分都可以正常工作）。这可能是一个高度孤立的案例。我搜索任何相关的问题，但找不到。任何提示和建议都会非常有用。感谢。

Answer 1

您是否考虑过任何图片问题？有时，没有指定高度/宽度的非缓存图像会导致位置问题。试试https://github.com/desandro/imagesloaded，看看这是否有帮助。

Answer 2

jQuery UI使用collision detection并且在发现碰撞的地方，它会将定位的项目放在不同的位置。未指定的默认值（如您所示）是翻转，因此它会将元素翻转到目标的另一侧（如您所述）。

尝试将碰撞更改为＆＃34;无＆＃34;。

我遇到了同样的问题，奇怪的是只在初始加载时影响页面，但在后续加载时没问题。

jQuery UI在第一次加载时定位错误位置并在第二次重新加载时更正

2 个答案: