要素の順番を取得するindex()
の使い方をご説明します。
タブメニューなどでクリックした順番を取得したりと、便利に使う方法もお伝えします。
要素の順番を取得するindex()
の使い方をご説明します。
タブメニューなどでクリックした順番を取得したりと、便利に使う方法もお伝えします。
特定の要素にのみ処理をさせたり、順番を取得する際に便利なeq()
メソッドはいろいろな場面で使うことになるでしょう。
基本的な使い方はもちろん、最後から数える方法や、複数の要素を取得したり、変数化した順番を指定したりとさまざまな使い方をご紹介します。
よく使うメソッドですので、これを機に使いこなせるようになりましょう。
jQueryでプラグインに頼らず、簡単にタブメニューを実装する方法のご紹介です。
プラグインを使わなくても意外と簡単に実装できますので、ぜひ試してみてください。
CSSでデザインする方法と、画像を使う方法の2パターンをご紹介します。
jQueryのposition()
は要素の位置を取得するメソッドですが、offset()
と混同しがちですね。
offset()
はドキュメントの左上を起点にしているのに対し、position()
はオフセットの相対関係のある親要素を起点にしています。
絶対位置と相対位置の違いですね。
同じ要素内に別の要素を配置する場合はposition()
が便利でしょう。
参考:jQueryのoffset()で表示位置の取得と要素の移動
jQueryのload()を使えば、他のページからテキストなどを引っ張ってくることができます。
今回はコンテンツを引っ張ってくる方法、エラーの対処法や注意点などをお伝えします。
ネイティブのJavaScriptメソッドreplace()
を使って、特定の文字列を別の文字に置換したり、削除する方法です。
複数の要素・文字列の処理、その他便利なjQueryメソッドも併せてご紹介します。
取得した文字列を一部書き換えたり削除したり、改行コードを置換したりと実際に使うことも多いかと思いますが、簡単に処理できますのでマスターしたいですね。
テキストや画像をフワッと出現させるfadeIn()
やスーッと消したりするfadeOut()
それらを交互に処理してくれるfadeToggle()
を中心にご紹介します。
jQueryで記述してもいいのですが、個人的にアニメーションなどの装飾的な部分はCSSのアニメーションで処理することが多く、classを付与して動作させる方法も併せてご紹介します。
とても簡単に実装可能ですので、試してみてください。
ブラウザの幅や高さが変更されたら検知して処理してくれる便利なメソッドがresize()
です。
常に画面の中央にタイトルを表示させたい場合に使いました。
ただ$(window)
以外の要素には使えないので注意しましょう。
HTML属性を取得するattr()
ではチェックなどの動的な動作に対応していなかったり、フォーム周りで上手く取得できないことも多かったため、フォームのプロパティを取得したり設定するために、jQuery 1.6
よりprop()
が追加されました。
checked
disabled
selected
などのプロパティはprop()で操作するようにしましょう。
jQueryでHTML属性を操作するattr()
の使い方です。
id
を取得したりhref
を設定したりなど、HTML属性の取得、複数の属性の設定、removeAttr()
を使った属性の削除、またフォームでの不具合などについてご紹介します。