0

这让我发疯...

我有一个文件名列表，我只想垂直滚动，所以如果文件名（=div）比列表本身宽，我想“带出”完整的 div 以显示名称。

你可以在这里看到这个我的行动：http: //j25.wasen.net/index.php/news

我通过在悬停时创建 div 的克隆并将其添加到主体并在其上设置非常高的 zIndex 来解决此问题。这是一个克隆 div 将出现在所有内容的顶部，但与原始 div 的位置相同。

我真的不明白为什么，但由于某种原因，宽度小于列表的 div 显示在错误的位置。但是，超出宽度的项目会显示在正确的位置。

我想检查包含名称的 div 是否超过列表的宽度，然后才创建克隆，这也是只需要它的时候。

但是我无法获得 div 的真实宽度。我添加了 Console.log 语句，以便显示它捕获的宽度。

我检查附加到身体（=克隆）的div的宽度，而不是列表中的div（部分隐藏）......

如何获得 div 的真实宽度？

谢谢！

4

2 回答 2

0

下载 Mozilla 的 firebug 插件。安装后，您可以右键单击任何元素以查看其样式和布局等。

选择右下角的布局选项卡，如果将鼠标悬停在 div 上，您将看到元素尺寸，包括任何边距和填充。

在这里下载：https ://getfirebug.com/

希望有帮助。

于 2013-01-11T14:28:30.667 回答
0

你的大前提是好的。请参阅此示例。为此，我

  1. 创建悬停列表项的克隆
  2. 用于offset正确定位
  3. 在 mouseleave 上删除悬停的元素

Hover造成不必要的闪烁。因此单独事件处理的原因。

http://jsfiddle.net/5zErQ/

var $clone;
$('li').mouseenter( function() {
  $clone = $('<span />', {text: $(this).text(), class:'temp'});
  $clone.css({position:'absolute', top:$(this).offset().top, left:$(this).offset().left});
  $('body').append($clone);
});

$('body').on('mouseleave', 'span', function() {
  $(this).remove();
});
于 2013-01-14T03:20:18.020 回答