WordPressでページ離脱時にアラートを出す方法【jQuery】
フォームの入力途中でページから離脱しようとしたときにアラートを出すとユーザーの利便性が高まります。WordPressでそのような離脱アラートを出すには編集画面でスクリプトを記述できるプラグインが必要です。ここではそのプラグインの使い方とjQueryでページ離脱時にアラートを表示する方法について解説します。
「 JavaScript 」一覧
jQuery+CSSで文字をゆらゆら揺らすアニメ効果をつける方法
CSS3では要素にアニメーション効果をつけるアニメーションプロパティを使うと要素に対して様々なアニメーション効果をつけられるようになりました。ここではそのアニメーションプロパティとjQueryを使って１つ１つの文字がばらばらに上下に揺れるようなアニメーション効果をつける方法について解説します。
jQuery呼び出しの３つのタイミング【インライン、$(document).load、$(window).ready】
jQuery関数を呼び出すタイミングは３つに分けられます。要素の書き換えやCSSの変更、画像の大きさを取得したい場合はただjQuery関数を書くだけでは動かず、適切なタイミングで実行する必要があります。ここではjQueryの呼び出しをするための３つのタイミングとその中でどのような処理を書くべきかについて解説します。
WordPressでjavascriptを使って広告をランダム表示する方法
javascriptを使うと広告をただ表示するだけでなくページを更新するたびに違う種類の広告をランダム表示できます。WordPressで広告をランダム表示するには記事内とサイドバーなどの固定領域で方法が違うのでここではスクリプトで広告切り替えする方法とそれぞれの場所でランダム切り替えする方法をそれぞれ解説します。
要素表示時に回転・拡大・スライドしてアニメ表示する方法とアニメーション例
何か動作があった時にただ要素を表示するだけでなく回転や拡大などのアニメーション効果をつけるとユーザーに興味を持ってもらいやすくなります。ここではCSSのtransformプロパティとjQueryのcss関数を使って要素に変形効果をつけ、ユニークなアニメ表示をする方法と実際のアニメ表示の例について紹介します。
個別ページにJavaScriptを埋め込めるWPプラグイン”Scripts n Styles”の紹介
WordPressでは個別ページにscriptタグを設置してその中にスクリプトを書くと各行にbrタグが挿入されてしまい、スクリプトが実行できません。そこでここでは各ページの編集画面でJavascriptの記述ができる「Scripts n Styles」というプラグインの導入・使い方を解説します。スクリプトだけでなくCSSなども記述できるのでとても役立ちます。
WordPressでjQuery-UIを導入してウィジェットを使う方法
jQuery-UIはjQueryからプログレスバー、ダイアログ、スライダーなどのウィジェットを扱うためのライブラリです。WordPressではjQuery-UIは標準では使えないのでライブラリを導入する必要があります。ここではヘッダー部分にjQuery-UI呼び出しのコードを書き、個別のページでウィジェットを扱うようにする手順を解説します。
WordPress記事内にカスタムCSSやJSを簡単に埋め込む方法
カスタムCSSやjavascriptをWordPressサイトで組み込みたい場合、「Simple Custom CSS and JS」というプラグインが使いやすくておすすめです。ここではこのプラグインの導入・使い方からWordPressでカスタムCSS・JSを扱うときの注意点まで解説します。
jQueryでの要素の内容やCSSの書き換え・取得方法まとめ
jQueryを使った場合、要素の内容(テキストやHTML)や要素に適用されているCSSを簡単なスクリプトで書き換えすることが可能です。ここでは要素の内容の取得と書き換えによく使われるtext関数、html関数、css関数の３つの使い方について解説します。