Javascript 在不同的链接上显示不同的文本

在这种情况下，当我单击照片时，会显示目标div图库。我想显示目标div的一些效果，如缓入或缓出或幻灯片效果等，使其看起来更吸引人。最初，目标div图库不会显示为css中的显示：图库没有显示。我还尝试了此功能的转换属性，但它不起作用。所以请帮我解决这个问题

<div>   
    <ul id="nav">
        <li><a href="#main">Home</a></li>
        <li id="gallary"><a href="#gallery">Photos</a></li>
    </ul>
 </div>

 <div id="gallery">
     <h3 style="font-family:'Comic Sans MS';color:white;font-size:25px;text-align:center;font-weight:bold;">GALLARY</h3>
     <div id="gallary_images"><a href="slide1.jpg" data-lightbox="roadtrip"><img src="slide1.jpg"/></a></div>
     <div id="gallary_images"><a href="slide3.jpg" data-lightbox="roadtrip"><img src="slide3.jpg"/></a></div>
     <div id="gallary_images"><a href="slide4.jpg" data-lightbox="roadtrip"><img src="slide4.jpg"/></a></div>
     <div id="gallary_images"><a href="slide5.jpg" data-lightbox="roadtrip"><img src="slide5.jpg"/></a></div>
     <div id="gallary_images"><a href="slide1.jpg" data-lightbox="roadtrip"><img src="slide1.jpg"/></a></div>
     <div id="gallary_images"><a href="slide5.jpg" data-lightbox="roadtrip"><img src="slide5.jpg"/></a></div>
</div>

---

听起来这个jQuery函数很适合您的需要：

上面的页面上有一个示例，我已对其进行了修改，供您试用：

$( "#gallary" ).click(function() {
  $( "#gallery" ).fadeIn( "slow", function() {
    // Animation complete
  });
});

我假设您希望单击

以显示的内容

如果我可以添加一些进一步的注释，请尝试重命名您的元素ID，使其更具描述性，并注意您使用了“gallary”和“gallery”两种拼写，这使其难以阅读。此外，单个id应该是唯一的，而同一个类可以多次使用

最后-不要使用连环漫画！：D

编辑：我已经添加了在退格时关闭的额外要求：

$('html').keyup(function(e){if(e.keyCode == 8)
  $( "#gallery" ).fadeOut( "slow", function() {
    // Animation complete
  });})

---

正如我在评论8=backspace，36=escape key中提到的那样。这很有效。谢谢你。但是有一个问题。当我在键盘上按backspace时，图库内容应该消失，但事实并非如此。嗨，这应该可以通过jquery实现：$（'html'）.keyup（函数（e）{if（e.keyCode==8）$（“#图库”）.fadeOut（“slow”，函数（）{//动画完成}）；}）在上面我使用了键码8，这是退格。你也可以使用36，这是转义键。但是如果有多个div，比如我有3个或更多的div要显示，那么我如何解决这个退格问题，我必须显示前面的内容。我似乎无法理解你的问题，但我注意到了另一个问题：你使用id“gallery”两次：一次在

中，第二次在

中。在一个html文档中不能使用id两次。大多数情况下都可以使用id，但您永远不知道会发生什么。所有

标记也是如此。最后，您要查找的单词是“gallery”。

$('html').keyup(function(e){if(e.keyCode == 8)
  $( "#gallery" ).fadeOut( "slow", function() {
    // Animation complete
  });})