0

私は次のコードを使用しています。これはうまく機能していますが、ショーがアクティブなときに<div id"Show">を切り替えたいと思います。<div id"hide">誰もこれを行う方法を知っていますか?

    <!--Script for Show Hide-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("#aboutcontent").hide();
  });
  $("#show").click(function(){
    $("#aboutcontent").show();
  });
});
</script>
<!--/script for show hide-->

HTML:

<div class="homepage-acecontent">
<div id="show"><img align="left"  style="margin-right:5px;" src="/template/images/btn-expand.png" border="0" alt="" /> ABOUT GENUINE H-D<sup>&reg;</sup> WORK WEAR</div>
<div id="hide"><img align="left"  style="margin-right:5px;" src="/template/images/btn-close.png" border="0" alt="" /></div>
<div id="aboutcontent">Content to show and hide goes here<!--/aboutcontent--></div>
<!--/homepage-acecontent--></div>

CSS:

 .homepage-acecontent{float:left; width: 1148px; color:#ff6418; font-size:11px; font-weight:bold; margin-left:40px;}
#aboutcontent{float:left; width: 1148px; color:#fff; font-size:14px; font-weight:normal; **display:none;**}
#aboutcontent a:link, #aboutcontent a:visited{color:#ff6418; text-decoration:none;}
#aboutcontent a:hover{color:#f68428;}
#show{cursor:pointer;}
4

6 に答える 6