七色(虹色)に輝くブログタイトル再び―javascriptライブラリ

本ブログの姉妹ブログ ホームページ作成浜松Tips に於いて 七色でブログ内検索する と得られる結果は、2008年7月11日の記事 七色に輝くブログタイトル で初めて実装して以来綿々と両ブログのタイトルに潤いを与えてきた機能である ブログタイトルの色を次々と七色に変化させていく為のその手法が記されている記事群であります。

七色(虹色)に輝くブログタイトル再び:うさ犬レインボー 検索結果記事群にも有りますことをここで再びもう少し噛み砕いて書けばこの機能は javascript と言うホームページに動きを持たせることの出来るプログラムを使って実現しています。 身近で有名な例で言えばインターネットの地図サービスの質を劇的に向上させた Googleマップ もこの技術を利用しています。 貴方のブログでも例えば画面上に雪を降らせたり紅葉を散らせたりする カスタムプラグインで利用しているかも知れません。 ここでも javascript が使われています。

さて javascript では様々なことが実現できますが、 実現するためには勿論プログラムを組まなきゃいけません。 例えプログラマーでも一から総てプログラムするのは大変です。 こんな時プログラマーは或る程度の基本機能を提供するように組まれた プログラムを利用してプログラムする負担を減らします。 これを ライブラリ と称し javascript のライブラリとしては jQuery が有名です。 更にこのライブラリの上で詳細に立ち入った機能を提供するプログラムを プラグイン と呼んでいます。

七色(虹色)に輝くブログタイトルでもライブラリ JQuery とそのプラグインの COLOR ANIMATIONS を利用してその機能を実現しています。

本ブログはブログとしては極端に多種多様な javascript を利用しており、 それが各記事に依存している状況もあったりしますので、 想定通りに動いてくれないこともまま有ります。 ブログタイトルの輝きもしばしば失われている状態でした。 其処で近日少しチューニングをしました。 ライブラリやプラグインを読み込ませる位置やタイミングによっても結果は異なってくるし、 クロスブラウザ(ブラウザによって動きが異なる)問題もあったりしますのでなかなか難しい処ですが、 貴方から見て本ブログタイトルは七色に輝いて見えているでしょうか?

虹色ブログタイトル

虹色に輝くブログタイトル 本ブログのタイトル表示は環境に拠っては、 虹色に変化して最終的に黄緑色に落ち着いて見られるのではないでしょうか。 これは javascript と言う技術を使って実現しています。

若し興味を持たれた方は多少専門的になりますが、 本ブログの姉妹ブログ ホームページ作成浜松Tips の2008年7月11日の記事、 七色に輝くブログタイトル 及び、関連タグ記事 レインボータイトル に詳細を記してありますのでご参照下さい。

虹色に輝くブログタイトル7

扠も又もや当タイトルはお馴染みギミックの七色に変化するが機能を発揮すべく、 前回の2008年11月20日にブログタイトル七色変化実装の記事は 七色に輝くブログタイトル6 投稿より20記事の投稿を重ねるに因り、次頁へ退去の時期とあっての当記事の投稿にて、 本アーティクルがトップ頁に表示さる間は 当ブログのタイトルがトップ頁表示と同時に虹色擬きに変化し始める 筈です。

jQueryと共に利用のフォント色を変更するアニメーション用プラグインは Release:jQuery 1.2/Effects にて提供の jquery.color.js を利用すれば先ずは単純にブロック内の変化を促すべく » Run ボタンを押下いただいた上で反応を見ていただき、
更には » Run2 押下でタイトルへの変化の適用をご覧いただけるべく配置しおります。 此の機能を利用した上で赤、青、桃色、紫、空色、緑、黄色、と任意勝手に 虹色 と称し、必要な設定を施して動作させている本タイトルの虹色に輝くブログタイトルになります。

又、「次のページ」へをクリックして頁遷移しても一連のアーティクル レインボータイトル が在るに依りタイトル七色変化機能は失われること無く、 又、当機能の切れる其の先には一連の ブログタイトルズームアップ アーティクルの存在すれば即ち、以前からのお馴染みにはご存知、 タイトル拡大機能が当該者へのお慰みの一助になれるかに心得ます。

先日は2008年文化の日の六代目へのテンプレート変更のアーティクル テンプレート変更『クリスマス7(3カラム)』 にて背景画像とブログタイトルの位置関係もあればDescriptionとの表示位置をば此れ逆転、 個別ページに於いては勿論トップ頁にては第一番目のアーティクルではスクロールの必要も無く、 一瞥にて目にお留めいただくべく配置致し候。

虹色に輝くブログタイトル6

己のブログを開くに通常とは異なる何やら違和感の、 気づいて見ればすっかり失念は当タイトルお馴染みのギミックの 虹色変化するタイトルが機能の発揮されぬを トップページは一日其の儘に過ごした上での本日の昨日の、 頻繁に当ブログにお通いいただく皆様にも感ぜせしめたかも知れぬは申し訳なくも、 此れもブログ全体ではなく アーティクル単体に実装する 故のハプニングとお楽しみいただければ幸いに存知ます、 前回の2008年10月15日にブログタイトル七色変化実装の記事は 七色に輝くブログタイトル5 投稿より20記事の投稿を重ねるに因り、次頁へ退去の時期とあっての当記事の投稿にて、 昨日と異なり一昨日とは同じく、本アーティクルがトップ頁に表示さる間は 当ブログのタイトルがトップ頁表示と同時に七色に変化し始める 筈です。

又、「次のページ」へをクリックして頁遷移しても一連のアーティクル レインボータイトル が在るに依りタイトル七色変化機能は失われること無く、 又、当機能の切れる其の先には一連の ブログタイトルズームアップ アーティクルの存在すれば即ち、以前からのお馴染みにはご存知、 タイトル拡大機能が当該者へのお慰みの一助になれるかに心得ます。

当機能にて 虹色 と称すは現在利用の テンプレート に合わせページを開いた時点のデフォルトなる白色から、 赤、青、桃色、紫、空色、緑、黄色、と任意勝手に変化させるべく、 最終的にデフォルトの白に落ち着くように設定を jQueryと共に利用のフォント色を変更するアニメーション用プラグインは Release:jQuery 1.2/Effects にて提供の jquery.color.js に施しています。

先日は2008年文化の日の六代目へのテンプレート変更のアーティクル テンプレート変更『クリスマス7(3カラム)』 にて背景画像とブログタイトルの位置関係もあればDescriptionとの表示位置は逆転させておりますことで、 トップ頁にては第一番目のアーティクルではスクロールの必要も無く、 目にお留めいただけるものと思われれば、 一瞥を与えられれば喜ばしからんことにて御座候。

虹色に輝くブログタイトル5

頃日は当ブログの日毎の更新も叶わねば 2008年重陽の節句にブログタイトル七色変化実装の記事は 七色に輝くブログタイトル4 投稿より20記事の投稿を重ねるに因り、次頁へ退去の時期とあっての当記事の投稿にて、 本アーティクルがトップ頁に表示さる間は 当ブログのタイトルがトップ頁表示と同時に七色に変化し始める 筈です。
又、「次のページ」へをクリックして頁遷移しても一連のアーティクル レインボータイトル が在るに依りタイトル七色変化機能は失われること無く、 又、当機能の切れる其の先には一連の ブログタイトルズームアップ アーティクルの存在すれば即ち、以前からのお馴染みにはご存知、 タイトル拡大機能が当該者へのお慰みの一助になれるかに心得ます。

当機能にて 虹色 と称すは現在利用の テンプレート に合わせページを開いた時点のデフォルトなる白色から、 赤、青、桃色、紫、空色、緑、黄色、と任意勝手に変化させるべく、 最終的にデフォルトの白に落ち着くように設定を jQueryと共に利用のフォント色を変更するアニメーション用プラグインは Release:jQuery 1.2/Effects にて提供の jquery.color.js に施しています。

当ブログを訪れるに間を置かずスクロールし記事を閲されるは有り難きことなれぢ、 今暫しご緩りとスクロールを止め、若しくはスクロールを戻され、 一瞥を与えられれば喜ばしからんことにて御座候。

七色に輝くブログタイトル4(虹色はいくつか)

本日は2008年重陽の節句に、 又もやjQuery利用のブログ・タイトル七色変化が2008年8月20日に実装の記事 七色に輝くブログタイトル3 投稿より20記事の投稿を重ねるに因り、次頁へ退去の時期とあっての当記事の投稿にて、 本アーティクルがトップ頁に表示さる間は 当ブログのタイトルがトップ頁表示と同時に七色に変化し始める 筈です。
又、「次のページ」へをクリックして頁遷移しても一連のアーティクル レインボータイトル がありますからタイトル七色変化機能は失われることは無く、 更にはこの機能の切れる其の先でも一連の ブログタイトルズームアップ アーティクルの存在すれば即ち、以前からの読者にはお馴染みタイトル拡大機能が 閲覧者へのお慰みの一助になれるかに存知ます。

現在利用の テンプレート に合わせページを開いた時点のデフォルトなる薄濁紺から、 赤、青、桃色、紫、空色、緑、黄色、白、と変化して、 最終的にデフォルトの薄濁紺に落ち着くように設定を 虹色 と称す当アーティクルですが、 虹色には諸説紛々あるようで、 本邦では取りも直さず7色と表現されれば其れに従い用意した色が 上記より白、薄濁紺を除くを虹色擬きとしています。

虹色についてWEBを閲すれば 『ウィキペディア(Wikipedia):虹』 には流石に詳しく以下引用
虹の色の数は現在の日本では一般的に七色(赤、橙、黄、緑、青、藍、紫)と言われるが、地域や民族・時代により大きく異なり、アメリカやフランスなどでは一般的には六色(赤、橙、黄、緑、青、紫)、もしくは藍を加えて7色といわれたりする。ドイツでは五色、スウェーデンでは(赤、黄、青、緑、桃、藍)である。日本でも古くは五色、沖縄地方では二色(赤、黒または赤、青)とされていた。なお現代でもかつての沖縄のように明、暗の2色として捉える民族は多い。 赤地に黄、緑、青の縞(赤、黄、赤、緑、赤、青、赤)だとする地域(インドネシア、フローレンス島)も存在し、スペクトルとして光学的に定められた概念とは異なった順序として色が認識されることも多い。 スペクトルの項で後述するが虹を7色としたのはイギリス人の科学者ニュートンが最初であり、「オリジナルの基本色は、赤・黄・緑・青・菫それに橙・藍がありその中間に無限の変化がある」と述べている。故にイギリスでは一般的に虹は7色とされている。
の如く記され、 吾人には常識たる七色許りにあらずして、六色、敷島の国たる本邦にても古には五色とて、 加え果ては明暗の二色迄とは斯くも彩豊かなるは流石、 虹の虹たる所以かに感じます。

IT系にてはお馴染みのアップルは林檎マークを云われてみれば6色に着彩するは All Aboutの2007年9月2日の水谷哲也氏に依る記事 アップル社のリンゴマークは旭という品種 を拝見すればなかなかに面白き知見が掲載されており、 中には虹色についても記され、アップルロゴの変遷抔も加えて述べられれば、 当ブログには屡参照させていただく IDEA*IDEA の2008年2月8日の記事 アップル、マイクロソフト、グーグル・・・あの企業のロゴはどう変わってきたか? にはロゴの変遷が画像入りにて掲載されておりますので、 興味のある方はご一読の程を。

七色に輝くブログタイトル3

アーティクル・タイトルの示すjQueryを利用したブログ・タイトル七色変化が2008年7月31日に実装の記事 七色に輝くブログタイトル2 投稿より20記事の投稿を重ねるに因り、次頁へ退去の時期とあっての当記事の投稿にて、 このアーティクルが存在する間は 当ブログのタイトルがトップ頁表示と同時に七色に変化し始める 筈です。

2008年7月11日、当機能初期時点での実装では、 ページを開いた時点のデフォルトは白、 其処から、赤、青、桃色、紫、空色、緑、黄色と変化して、 最終的に白に落ち着くように設定しましたが、 現在利用の テンプレート に合わせ、 ページを開いた時点のデフォルトの色、及び最終的に落ち着く色に少し薄く濁った紺系の色を加え、 javascriptに於いてみれば下記の緑字部分が各対応になります。
<script type="text/javascript">
<!--
$(document).readyjQuery(document).ready(function($) {
$("h1.blogtitle a").animate( { color: ´red´ }, 2500) ⁄⁄ 赤
.animate( { color: ´blue´ }, 2500) ⁄⁄ 青
.animate( { color: ´pink´ }, 2500) ⁄⁄ 桃色
.animate( { color: ´#6e2fe9´ }, 2500) ⁄⁄ 紫
.animate( { color: ´#2fe1e9´ }, 2500) ⁄⁄ 空色
.animate( { color: ´green´ }, 2500) ⁄⁄ 緑
.animate( { color: ´yellow´ }, 2500) ⁄⁄ 黄色
.animate( { color: ´#ffffff´ }, 2500) ⁄⁄ 白
.animate( { color: ´#355076´ }, 2500); ⁄⁄ 薄濁紺
});
//-->
</script>

「次のページ」へをクリックして頁遷移しても一連のアーティクル レインボータイトル がありますからタイトル七色変化機能は失われることは無く、 更にはこの機能の切れる其の先でも一連の ブログタイトルズームアップ アーティクルの存在すれば即ち、以前からの読者にはお馴染みタイトル拡大機能が 閲覧者へのお慰みの一助になれるかと思います。

七色に輝くブログタイトル2

2008年3月9日より4ヶ月間は一季節と一月の2008年7月10日迄、 当ブログを賑々しく飾って来てくれた一連の記事 ブログタイトルズームアップ に取って代わったは20記事以前の2008年7月11日のアーティクル 七色に輝くブログタイトル にてjQueryにアニメーションプラグインを付加し、 このアーティクルが存在する間は当ブログのタイトルがトップ頁表示と同時に七色に変化し始める 様にしました。

2008年7月11日、当機能初期実装時点では ページを開いた時点のデフォルトは白に指定し、 其処から、赤、青、桃色、紫、空色、緑、黄色と変化して、 最終的に白に落ち着くように設定しましたが、 2008年7月20日のアーティクル テンプレート変更『ボート(3カラム)』 にある様に、テンプレートの変更に合わせ、 ページを開いた時点のデフォルトの色、及び最終的に落ち着く色を、 テンプレート指定の色に変更し、 其の変更点がアーティクル内 CSS に於いては
h1.blogtitle a{color:#355076;}
に、また javascriptに於いては下記の赤字部分の追加になります。
<script type="text/javascript">
<!--
$(document).readyjQuery(document).ready(function($) {
$("h1.blogtitle a").animate( { color: ´red´ }, 2500)
.animate( { color: ´blue´ }, 2500)
.animate( { color: ´pink´ }, 2500)
.animate( { color: ´#6e2fe9´ }, 2500)
.animate( { color: ´#2fe1e9´ }, 2500)
.animate( { color: ´green´ }, 2500)
.animate( { color: ´yellow´ }, 2500)
.animate( { color: ´#ffffff´ }, 2500);
.animate( { color: ´#355076´ }, 2500);
});
//-->
</script>

七色に輝くブログタイトル

2008年3月9日の 映画風タイトル・クローズアップ を皮切りに昨日2008年7月10日迄の4ヶ月間は一季節と一月、 当ブログを賑々しく飾って来てくれたのは一連の記事 ブログタイトルズームアップ での当ブログのタイトルをjQueryで表示と同時に拡大する機能ですが、 最早季節も春浅き肌寒ささえ感じた当時より、 遠州浜松では梅雨も明けんとす、人によってはエアコン点火なしには過ごせぬ時期なれば、 新機能に衣替えすることにしました。

手元のjQuery本2冊 を見れば矢張り魅力的なのはアニメーションなのですが、 どうもフォント色を変更するアニメーションはjQuery本体には実装されておらず、 プラグインで実現する模様にて、早速具々って見れば、 jquery.color.js なるプラグインが相当し、其のサンプルコードが Release:jQuery 1.2/Effects ページ内の Color Animations項目に掲載されており、 其れを利用して、 当ブログのタイトルをページ表示と共に七色に変化するようにしました。
このアーティクルが存在する間はブログタイトルがトップ頁表示と同時に七色に変化し始める筈です。

実装していた拡大される筈のタイトル表示に変化がなくなるエントリー順は二十度に一度を6度繰り返した jQueryを利用する拡大機能を含む記事が次頁繰り送りの時期となっての衣替え、 トップページよりは終に消えてしまう当該機能も、 「次のページ」へをクリックして頁遷移すれば以前の記事 ブログタイトルズームアップ4 がありますからタイトル拡大機能は其のページでは失われることも無く、 更に以降其の先の、[次のページ]へをクリックしても一連の ブログタイトルズームアップ アーティクルの存在すれば即ちタイトル拡大機能に対する懐旧の思いに駆られれば、 トップページよりのアクセスの際は順に「次のページ」へを押下、進んでご覧いただくことが出来ます。