Jquery菜单无法正常工作

时间:2011-06-17 11:44:40

标签: jquery html css

我在这里有这个jquery菜单

http://jsfiddle.net/pJMva/8/

它似乎无法正常工作......按钮应该在悬停时向右扩展

感谢所有的努力

2 个答案:

答案 0 :(得分:5)

position:relative;添加到您的css:

.anim_queue_example1 a
{

    margin: 15px;
    width: 50%;
    height: 25px;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    -webkit-box-align: center;
    -moz-box-align: center;
    box-align: center;

    text-decoration: none;

    font-size: 15px;
    font-weight: 700;

    background: #333;
    color: #fff;
    position:relative;

}

示例:http://jsfiddle.net/niklasvh/pJMva/10/

答案 1 :(得分:2)

这样可行。

$(document).ready(function() {
  $('ul.anim_queue_example1 a')
    .hover(function() {
          $(this).animate({
              opacity: 0.25,
              left: '+=20',
              height: 'toggle'
          }, 5000, function() {
          // Animation complete.
          });
     }, function() {
          $(this).animate({
          opacity: 0.25,
          left: '+=0',
          height: 'toggle'
          }, 5000, function() {
             // Animation complete.
        });
    });

});

在此处查看工作示例http://jsfiddle.net/pJMva/23/