FCafe  今日を分別表示

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

  ブログテンプレートの CALENDAR 上で『今日』 の日付を分別表示したいという要望をカスタマ掲示板で目にしました。
この機能は一部他ブログではサポートされている( JUGEM では後に停止された)機能ですが、システムに負荷が掛かる為なのか FC2blogでは実装されていません。 が、これは我々クライアントサイドでもテンプレートにスクリプト等を加える事により実現する事が可能です。

  JUGEMでは機能停止後、直ちにそれを代替するスクリプトが提供されたものですが、 「FC2の独自タグならひょっとして・・」 と挑戦してみた処、私にも可能であったので此処で御紹介させて頂くことにしました。
( 横型カレンダーの場合です )
【 設置法 】 CSSに today という『今日』を表示するスタイルを定める class を設定します
.today {background:red}
( 例: 背景色を赤にする )

head領域に以下のスクリプトを記述します
<script type="text/javascript"><!--
var today=new Date();
function dday(u1,u2,u3) {
var d=u3;
if (d.indexOf(">")>0) {d=(d.split('>')[1]).split('<')[0]}
var cday=new Date(u1,u2-1,eval(d));
var df=(today-cday);
if (df>0 && df<86400000) {document.write('<span class="today">'+u3+'</span> ')}
else {document.write(u3+' ')}
}
--></script>

カレンダー部を以下のように改変します。
<!--calender2-->
<script type="text/javascript">dday(<%now_year>,<%now_month>,'<%days>')</script>
<noscript><%days>&nbsp;</noscript>
<!--/calender2-->


【 解 説 】 スクリプトはまず「今日」が何日であるかを示す変数”today”を作成します。
日にちを同定する関数”dday()”はカレンダー部で<%now_year>と<%now_month>から年・月を取得し、<%day>と組み合わせてDateオブジェクトを作り、それを”today”と比較して「今日」であるかを判別し、そうであった場合はCSSのクラス”.today”をspanタグで適用します。
( 応用すれば横カレンダでも「曜日別表示」等が可能になるかもしれません )
通常型カレンダーについては(可能であったらば)後日改めて・・ m(_)m

共有プラグインCalendArchiveに実装しました

Comment

いち いち Edit
06/10 03:41

初めまして。
これ、便利な機能で助かっています。

ところで、このカレンダーだと日付同士の間隔が狭くて少し見づらく感じました。

これを使う前は、<%days>の後に全角スペースを入れると、日付同士の幅が変更できたんですが、これだと出来ませんでした。

何か的確な日付の間隔変更方法などありますでしょうか?

よろしければ教えてください。

daniel daniel Edit
06/10 08:46

いちさんおはようございます。
横型カレンダーの当日表示でございますね。
日付と日付の間隔をもっと拡げられたいと。
以下のようにされてみてください。
スクリプト中の +u3  を +'&nbsp;'+u3  に変更

いち いち Edit
06/10 21:25

変更したら幅を広くできました。
早速ご対応くださいまして、ありがとうございました。


.  
HN Title URL PW secret

TrackBack http://pcafe.blog3.fc2.com/tb.php/84-27fdca15

Shown after Admisson
.

≫ 空リンク非表示 1 零点は免れた? ≪

2005 / 03 / 25  Fri
Navigation   
Comment 3 / TB 0 / Edit
Designed by Daniel Corporation . all rights renounced
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。