タグ

2014年2月25日のブックマーク (1件)

  • jQueryで文章などのテキストに対して一文字ずつ個別に装飾を変える実験|BLACKFLAG

    先日、AllAboutさんの記事でWebページ上のテキストに対して 「1文字ずつ色を変えるなど、文字単位で装飾する方法 [ホームページ作成] All About」と題した jQuery+CSS3を使って1文字ずつ装飾を変える方法を解説していましたが これをCSS3未対応ブラウザでも実装できるように jQueryのみで文字単体に個別で指定を与える実験をしてみたので紹介してみます。 jQueryでテキストを一文字ずつ装飾を変える実験 まずはHTML上に下記の様な段落テキストを配置します。 ◆HTML <p class="split">jQueryでテキストを一文字ずつカットするサンプルテキストです。</p> そしてこのテキストに対して、jQueryを使って一文字ずつ個別に 任意のクラスの付けたinline要素(<span>)で囲うようにします。 スクリプトの記述は以下の様になります。 ◆SCR

    jQueryで文章などのテキストに対して一文字ずつ個別に装飾を変える実験|BLACKFLAG