HTMLソース内に任意のclassやidがあるかの判定を行う

-
カテゴリー:
javascript 

HTMLソース内に任意のclassやidがある場合のみ処理を実行したい時などに便利なので最近よく使う記述方法がこちら。
※jqueryが導入されていることが前提

 

 

ページを遷移させずにHTMLに他ページの内容を読み込む方法

-
カテゴリー:
javascript 

あまりケースとしては無いような手法なのですが、サイト全体を通してBGMをかけたい時など、インラインフレームが使えないなどの成約がある場合に便利だったので、メモ程度に記載させていただきます。
※以下コードはサンプルです。

まず、index.htmlのHTMLがこちら

内容はかなり簡素ですが、#navi内のリンクがクリックされると#main_frame内にそのリンク先のHTMLが読み込まれるようにjavascriptで制御します。

ページの内容自体は、top.html、page1~4.htmlにそれぞれ記載します。

javascriptは、jqueryが読み込まれていることが前提で、以下のコードを記述します。

#navi内のリンクがクリックされた際の処理をe.preventDefault()で無効化し、リンク先のURLを$(this).attr(‘href’)で取得しています。
そして、$(‘#main_frame’).load(url)でそのURLの内容を#main_frameに読み込んでいます。

以下のサンプルページより動作のチェックが行えます。※スタイルシートもindex.htmlのソースに記載されています。

サンプルページ

指定した要素がアニメーション中かどうかを判定する方法

-
カテゴリー:
javascript 

ユーザー側で操作可能なスライダー等の処理を書くときによく使うので、ちょっと忘れない用にメモ程度の投稿です。
※jqueryが導入されていることが前提

 

 

けっこうこの処理を入れていないと動作不良のもとになったりするので、重宝します。