jquery - 如何使 Javascript“滑出”菜单中的链接起作用

Question

我使用 Jquery 和 CSS 创建了一个非常简单的网站。

左侧有一个导航菜单。每个菜单项都链接到一个外部网站。不幸的是，这些链接实际上不起作用！

我错过了什么？？我对 JS 很陌生。

这是JS：

    <script type='text/javascript'>
    $(document).ready(function(){
    $('#slideout').hover(function() {screen
    $(this).animate({right:'0px'}, {queue:false, duration: 500});
    }, function() {
    $(this).animate({right:'-270px'}, {queue:false, duration: 500});
    });
    });
    </script>

这是HTML：

    <div id="slideout">
         <div id="slidefont">selected works</div>
            <div id="slideout_inner">
            <ul>
            <li>
            <a href="http://websitegoeshere.com" target="blank">test1</a>
            </li>
            <li>
            <a href="http://websitegoeshere2.com" target="blank">test2</a>
            </li>
            </ul>
            </div>
    </div>

Answer 1

You can do this without javascript only need to add css like this

li a:hover {
    padding-left: 10px;
}

With jquery You have to add this

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>


   <script type='text/javascript'>
   $("li a").hover(function() {
        $(this).stop().animate({paddingLeft : "10px"},200);
    },function() {
        $(this).stop().animate({paddingLeft : "0px"},200);
    });
   </script>

DEMO