jquery在调整窗口大小时计算元素大小
我希望有人能帮上忙 我已经编写了一个函数,它根据现有列表项的数量和父容器中的剩余宽度为nav ul中的最终li项添加宽度 在加载文档时,如果调整文档大小并单击了href,则此操作非常有效,但在实际调整大小期间,不会重新计算元素的大小 我做了一个例子来帮助说明这一点 有人知道如何在调整窗口大小时动态进行计算吗 这是jsjquery在调整窗口大小时计算元素大小,jquery,html,css,resize,drag,Jquery,Html,Css,Resize,Drag,我希望有人能帮上忙 我已经编写了一个函数,它根据现有列表项的数量和父容器中的剩余宽度为nav ul中的最终li项添加宽度 在加载文档时,如果调整文档大小并单击了href,则此操作非常有效,但在实际调整大小期间,不会重新计算元素的大小 我做了一个例子来帮助说明这一点 有人知道如何在调整窗口大小时动态进行计算吗 这是js $(document).ready(calcWidth); $(document).resize(calcWidth); function calcWidth(){ /
$(document).ready(calcWidth);
$(document).resize(calcWidth);
function calcWidth(){
// get array of all the list items in the nav
var $listWidth = $('ul#main-nav li').map(function(){
return $(this).width();
}).get();
var $itemCount = $('#main-nav li').length; //this works as margin-right is set to 1px
var $contWidth = $('#main-nav').width(); // get the full container width
var $sum = 0;
$.each($listWidth,function(){$sum+=parseFloat(this) || 0;});
$('ul#main-nav li.final a').css({
width: $contWidth - $sum - $itemCount, //set the width of the final li to be the total container minus the sum of the existing li elements
height: '12px'
});
}
如果你需要更多的代码张贴在这里,让我知道,但这一切都在小提琴
谢谢
Luke您不需要使用javascript来实现这一点 移动UL上的
clearfix
类(因为列表项是浮动的),在UL上添加紫色背景,并在列表项上添加1px的白色右边框。您可以删除最后一个LI
我一直在努力做到这一点,我不介意知道这个秘密。谢谢。我用叉子叉了你的小提琴!