1

这是我编写的第一个 javascript 代码，我遇到了一些麻烦。我正在制作一个垂直菜单，它将显示链接 onclick 的附加信息，同时隐藏任何其他链接的内容。我想将 .animate 'slow' javascript 添加到函数中，但有一些困难。这就是我所拥有的：

<script type="text/javascript">
function reveal(id) {
   var e = document.getElementById(id);
   if(e.style.display== 'block')
e.style.display= 'none';
   else
e.style.display= 'block';
e.style.opacity= '1';
    }
 </script>

 <script type="text/javascript">
 function hide(id) {
   var e = document.getElementById(id);
   if(e.style.display== 'block')
e.style.display= 'none';
   else
e.style.display= 'none';
    }
 </script>

我尝试了多种方法来放置“动画”标签，但似乎无法得到它。真诚感谢您的帮助。

4

1 回答 1

1

看着小提琴，似乎很混乱。我想出了一套更简洁的代码，你现在可以使用，但你还有很多东西要学。小提琴添加了http://jsfiddle.net/KMDjR/7/确保您调用 jquery （在小提琴中，它在左侧调用，但在您的页面中，您需要自己调用它，如下面的代码所示）

<html>
<head>

<style>
#foo{
display: none;
}

#poo{
display: none;
}
</style>
<!-- calling jquery  -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('.toggleFoo').live('click', function() {
        $('#foo').fadeIn(1000);
        $('#poo').fadeOut(1000);
    });

    $('.togglePoo').live('click', function() {
        $('#poo').fadeIn(1000);
        $('#foo').fadeOut(1000);
    });

});
</script>
</head>
    <body>
        <a href="#" class="toggleFoo">Click here to toggle visibility of element #foo</a><br /><br />
        <div id="foo">This is foo</div>

        <a href="#" class="togglePoo">Click here to toggle visibility of element #poo</a><br /><br />
        <div id="poo">This is poo</div>
</body>
</html>
于 2012-05-11T18:38:44.930 回答