49
54

More than 5 years have passed since last update.

便利なjQueryメソッドまとめ

Posted at

高さ系のメソッド

  • outerHeight():padding、borderまで含んだ高さを取得
  • outerHeight(true):marginまで含んだ高さを取得
  • height():純粋に高さ(height)を取得

(注)

  • 該当する要素が複数ある場合、最初の要素
  • height()に引数入れたら値をセット出来る(引数なしならgetter、引数ありならsetter)

(例)

  • $(window).height():ブラウザの高さを取得
  • $(document).height():ドキュメント(ページ全体)の高さを取得

座標系のメソッド

  • offset():ドキュメント上での表示位置(ドキュメントベースでの絶対座標)→topleftの2つを持つ
  • scrollTop():スクロール上での上位置(スクロール範囲の中での座標。相対座標)

よく使うイベント

  • scroll
  • click
  • resize

おまけ

[CSS]positionプロパティ

  • static:配置方法を指定しない。これが初期値。
  • relative:相対位置への配置。(基準位置の変更。親要素に対して用いる)
  • absolute:絶対位置への配置。
    • 親ボックスがstatic→基準はウィンドウの左上
    • 親ボックスがstatic以外→基準は親ボックスの左上
  • fixed:絶対位置への配置。(スクロールしても位置固定)
  • sticky:対応ブラウザSafari, iOS Safariのみ(2014年7月16日現在)

メソッドチェーン

メリットは、

  • $の記述1回で済む
  • 処理速度向上
49
54
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
49
54