jQueryでサクッとコールバックしてみる

カテゴリー︎: 【JavaScript】・【jQuery】

javascriptでいうコールバックしてみる

<body>
  <style>
  div{
    background: gold;
    font-size: 10px;
    display: none;
  }
  </style>
  <h1>サクッとコールバック</h1>
  <button>コールバック発動!</button>
  <div>ここが変化する</div>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script>
  $(function() {
    $("button").click(function() {
      $("div").show('slow', function() {
        var my_style = {
          color: "pink",
          backgroundColor: "gray",
          fontSize: "30px",
          width:"300px",
          height:"300px"
        }
        $(this).css(my_style);
      });
    });
  });
  </script>
</body>

※注意点として、スタイルシートの指定がjavascript指定である

PAGE TOP