使用链接隐藏元素

Question

我有一个网站有两个图像和一些文字。我需要对其进行编码，以显示正在加载的文本，但是单击链接时，文本消失并显示图像。当点击另一个链接时，会出现另一个图像。这可能需要javascript/jquery。我已经研究过改变班级，所以它显示：没有，但我不能让它工作。谢谢。这是一个模型：http://amosjackson.com/index

Answer 1

使用hide()和show()加上click事件。

$('#myLink1').click(function() { 
    $('#image1').show(); 
    $('#text1').hide(); 
}); 

Answer 2

使用jQuery，你必须从http://jquery.com/下载它，把它放在你的网站想要的，那么你必须导入它在你想使用它的页面。

把这个在您的网页头： <script src="/path/to/jquery/jquery-x.x.x.min.js"></script>

<script> 
    $(document).ready(function(){ 
     $('#homelink').click(function() { 
      $('#contact,#tardis').addClass("invisible"); 
      $('#home').removeClass("invisible"); 
     }); 
     $('#bloglink').click(function() { 
      $('#contact,#home').addClass("invisible"); 
      $('#tardis').removeClass("invisible"); 
     }); 
     $('#contactlink').click(function() { 
      $('#tardis,#home').addClass("invisible"); 
      $('#contact').removeClass("invisible"); 
     }); 
    }); 
</script> 

更改您的菜单链接到href=""href="javascript:void(0)"。

在你的CSS把这个类：

.invisible{ display: none; } 

最后，设置名为接触和TARDISDIV S中invisible类。