php - WordPressのdiv内のテキストをjQueryのfadeIn（）fadeOut（）する方法

Question

またはを使用fadeIn()しfadeOut()て WordPress メニューを作成できるように 2 つのボタンを作成しようとしていますが、機能しません... 以下の例では、. タグを使用するように変更すると、完璧に機能します...idclassid#menu_jqueryp

   <script>
   $(document).ready(function(){
      $(".btn1").click(function(){
        $("#menu_jquery").fadeOut();
      });
      $(".btn2").click(function(){
        $("#menu_jquery").fadeIn();
      });
    });
   </script>

 <button class="btn1">Hide Menu</button>
<button class="btn2">Show Menu</button>

<div id="menu_jquery">
 <?php #wp_page_menu( 'sort_column=menu_order' ); ?>
</div>

Answer 1

これを試して。それが動作します。

<script>
    jQuery(document).ready(function($) {
        $(".btn1").click(function() {
            $("#menu_jquery").fadeOut();
        });
        $(".btn2").click(function() {
            $("#menu_jquery").fadeIn();
        });
    });
</script>

Answer 2

$(document).ready(function(){
      $('#menu_jquery').hide();
      $(".btn1").click(function(){
          $("#menu_jquery").fadeOut();
      });
      $(".btn2").click(function(){
          $("#menu_jquery").fadeIn();
      });
});

Answer 3

このJSFiddleで動作します。

JavaScriptをスクリプトタグで囲んでいますか?

<script>
$(document).ready(function() {
    $(".btn1").click(function() {
        $("#menu_jquery").fadeOut();
    });
    $(".btn2").click(function() {
        $("#menu_jquery").fadeIn();
    });
});
</script>