在页面加载时调整元素大小时不一致的jQuery函数

Ahoy！我已经构建了一个小脚本来检查页面加载时左侧边距的大小，调整div的大小以填充它，并将头div更改为在其旁边浮动。在页面加载时调整元素大小时不一致的jQuery函数

下面的代码：

function buildHeader() { 
      var containerMarginLeft = $(".container_16:not(:first)").css("margin-left"); 
      var headerHeight = $("#header").height(); 
      $("#stripe").width(containerMarginLeft).height(headerHeight).css("float", "left"); 
      $(".container_16:first").css("float", "left"); 
      $("#header").css("margin-left", 0).width(950); 
     } 

     $(document).ready(function(){ 
      // Manipulate layout for the first time 
      buildHeader(); 
      // Manipulate layout when window is resized 
      var resizeTimer = null; 
      $(window).bind('resize', function() { 
       if (resizeTimer) clearTimeout(resizeTimer); 
         resizeTimer = setTimeout(buildHeader, 100); 
        }); 
     });

和显示是在这里：http://robertmay.me.uk/mockups/plane.html（它创建绵延左边的线）。现在，它适用于webkit浏览器。它在Mozilla中不起作用，我甚至没有在IE中试过它。任何人有任何想法，为什么它似乎不工作在Mozilla？我有一种感觉，它可能与CSS有关。

来源

2009-06-23 robotmay

在Firefox 3.0中，与Safari 4.0中的结果相比，该行有点太短，在此行中一直走到正确的位置。那么你的问题具体是什么？你在寻找解决方法吗？或者只是验证你提到的行为？你可以尝试混合浮动的图像和背景图像，并祈祷他们排队...... – 2009-06-23 23:52:23

啊哈，所以它可以在Windows 3上运行在Firefox 3上？它不在Mac版本上。我已经看到你在描述什么，这不是一个大问题，无论出于何种原因，它大约50px太短。任何想法为什么？在Mac FF3上，行div甚至不在那里，标题只是漂浮在左边。 – robotmay 2009-06-24 09:49:32

$(".container_16:not(:first)").css("margin-left");

无论窗口的宽度如何，该行在Firefox中给出'0px'的结果。但是，Safari中的Firebug Lite会根据窗口的宽度显示此值。

由于$（“。container_16：not（：first）”）在这两个浏览器中返回相同的元素，所以问题似乎与语句的.css（'margin-left'）部分有关。事实上，Firefox中的Firebug显示此元素的计算样式为marginLeft和marginRight为'0px'，但在Safari中为非零值。如预期，从“margin-left”变为“marginLeft”没有区别，也不直接访问属性，如$（“。container_16：not（：first）”）[0] .style.marginLeft ，因为Firefox首先计算错了。

对不起，我没有答案，但希望这会导致你在正确的方向。对我来说，虽然我会尝试使用CSS来对齐布局，但只能作为最后的手段诉诸JavaScript修正。

来源

2009-06-24 10:16:57 shuckster

在页面加载时调整元素大小时不一致的jQuery函数

回答

相关问题