タグ

ブックマーク / black-flag.net (4)

  • jQueryでリストなどに連番でIDやクラスを追加(ナンバリング)する方法|BLACKFLAG

    以前ここで「jQueryでの連番要素を制御する方法」と題して、 jQueryで連番要素の制御を簡単に行う方法を紹介しましたが、 同じ様にjQueryを使って簡単に連番でのIDを追加したりクラスを追加したりする方法を紹介してみます。 例えば<li>を使ったリストを5行で用意します。 HTML側では<li>自体にはIDもクラスも付けません。 ◆HTML【BASE】 <ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> そしてこれらのリストに対して、下記スクリプトを実行させることで 自動で連番でのクラスを追記することができます。 (クラス名は「.number1」~とします。) ◆SCRIPT【SAMPLE01】 <script type="text/javascript" src="http://ajax.googleapis.

    jQueryでリストなどに連番でIDやクラスを追加(ナンバリング)する方法|BLACKFLAG
  • jQueryで入力フォームに文字カウント(カウントダウン)を設置する方法|BLACKFLAG

    今やTwitterで有名になった、入力フォームに文字を入力した際のリアルタイム文字カウント表示。 この様なINPUTやTEXTAREAに入力されたテキストの文字数を数えるには jQueryの「$(●●●●).val().length;」を使うと簡単に取得することが出来るようだったので 文字カウント、カウントダウンのいろいろな取得パターンを作ってみました。 jQueryで入力フォームに文字カウント(カウントダウン)を設置【SAMPLE1】 まずは単純に入力された文字数を表示するパターン。 HTMLには文字数を表示するエリアと 入力フォーム(ここではTEXTAREA)を設置します。 ◆HTML <span class="count">0</span> <textarea name="textarea" rows="10" cols="30"></textarea> CSSは特に動作には関係しな

    jQueryで入力フォームに文字カウント(カウントダウン)を設置する方法|BLACKFLAG
  • jQueryでiframe内のページから親ページを操作する方法|BLACKFLAG

    少し前に「jQueryでiframeの親ページからインラインフレーム内の子ページを操作する方法」と題して、 iframeの親ページから子ページを操作する方法を紹介しましたが、 その逆の、iframeの子ページから親ページを操作をする方法について 簡単なサンプルを交えて紹介してみます。 親ページ側では特にjQueryファイル自体を読み込む必要は無く、 iframe内に表示するページ側で、jQueryファイルと共に 下記の様なスクリプトを書くことで操作することが可能になります。 ◆SCRIPT $(function(){ $('p',parent.document).css({color:'#ff0000'}); }); この記述方法(参考例)の場合だと、iframe内のページからの操作で 親ページの<p>タグのテキスト色を「赤」に変更します。 スクリプトを実行させる該当要素の後に「,pare

    jQueryでiframe内のページから親ページを操作する方法|BLACKFLAG
  • jQueryでsetTimeoutを使ってfunctionの実行を遅らせる方法|BLACKFLAG

    JavaScriptでfunctionの関数や様々な処理等を“何秒後”に実行、といった指定をする時に使う「setTimeout」。 jQueryでもこの指定を使うことが出来るのですが、必要な時に限って記述方法を忘れてしまっていることが多いので、ここにメモ書きしておきます。(ごく単純な記述なのですが…) $(function(){ setTimeout(function(){ ~ここに処理を記載~ },1000); }); 処理を記載する箇所の後ろにある数値は、“何秒後”に処理させるか、の値になります。 例えば、ページを読み込んだ後、3秒後にbodyをフェードインさせる場合。(フェードインするアニメーション時間は1秒) $(function(){ $("body").css({opacity:'0'}); setTimeout(function(){ $("body").stop().ani

    jQueryでsetTimeoutを使ってfunctionの実行を遅らせる方法|BLACKFLAG
  • 1