Question

我还有一个关于我的jQuery脚本的初学者问题。我有一个脚本，使菜单向右移动一点。第一个问题是<a>以某种方式获得底部填充，我不知道为什么以及如何。第二个问题是如何使用<td>元素填充整个<a>。我是jQuery的初学者，正在寻找一些学习方法，所以请耐心等待。非常感谢你的任何答案。

jQuery代码：

$(document).ready(function(){
    $('.menu a').hover(function(){
        $(this).stop().animate({width: '180px'}, "slow");
    }, function(){
        $(this).stop().animate({width: '160px'}, "slow");
    });
});

jsFiddle演示：Here

Answer 1

您不应该使用表格作为菜单。绝对没有理由这样做。请改用无序列表，例如：

<ul id="menu">
    <li><a href="#">Menu Item 1</a></li>
    <li><a href="#">Menu item 2</a></li>
</ul>

然后您可以将其设为：

#menu {list-style-type: none; margin:0;padding:0;}
#menu > li {background: #8B0B04;width: 160px;padding: 7px 30px 7px 0px;}
#menu a {color: #A9A582;text-decoration: none; font: 17px bold Helvetica;width: 100%; height: 100%}

关于你的第二个问题，我不确定你的意思？（：

编辑：

哦，jquery你可以把它改成：

$(document).ready(function(){
    $('#menu > li').hover(function(){
        $(this).stop().animate({width: '180px'}, "slow");
    }, function(){
        $(this).stop().animate({width: '160px'}, "slow");
    });
});

现在通过编辑，我理解你的第二个问题。我做了一个小提琴：

http://jsfiddle.net/k8vsA/

jQuery动画底部填充

1 个答案: