问css可能是jquery帮助

EN

对不起，我会在这里发帖。

我认为在div中需要一个div。外部div (表示导航下面的完整行)需要是整个导航的宽度。然后，您可以使用jquery将内部div (进度条)动画化为与上面的nav元素相同的宽度，并将其左侧位置动画化为添加了类的导航项的左侧位置。

就像这样

$(document).ready(function(){

    $('.selectedNav').click(function(){

    var navWidth = $(this).width();
    var posLeft = $(this).position();

    $('#innerDiv').animate({'width': navWidth, 'left': posLeft.left});

    });

});

制作一个带有文本和条“剪切”的绿色方框的图像(例如，将其“transparent)

• place”放入<div style="position:relative;">

• place中的另一个div：<div style="position:absolute;top:0px;left:0px;height:100%;" id="progress">

• Set将“”div的宽度设置为90px (步骤1 )，195px (步骤2 )，278px (步骤3 )，414px (步骤4)
• ，如果您愿意，可以设置为with using jQuery's <div style="position:relative;">
• place：$.animate({width: 195})以使其滚动。

这样做，你的条形图和文本都会移动。

如果你不关心文本，跳过图像部分，只做一个灰色的div，做同样的事情。

有关动画效果，请参见www.vouchr.com。

你可以试试这个jquery插件：http://grasshopperpebbles.com/ajax/a-jquery-progress-bar-plugin/