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

新着記事に対して、記事タイトル横にの画像を表示させるカスタマイズです。
FCafeのDanielさんの「新着マーク」という記事を参考にしています。ありがとうございました。

HTMLの編集を行います。
</head>

の直前に、以下の記述を追加してください。
<script type="text/javascript">
//<![CDATA[
var today=new Date();
function nw(u1,u2,u3,u4) {
var nt=24; //新着マークを表示する時間
var c=new Date(u1,u2-1,u3,u4);
if (today-c<3600000*nt) {
document.write('<img src="http://blog-imgs-1.fc2.com/i/image/e/303.gif" class="emoji" style="margin-left:0.3em;" />')}
}
//]]>
</script>


次に、
<div class="entry-title"><h2 class="entry-title">
<a href="<%topentry_link>"><%topentry_title></a></h2></div>
という部分を、次のように書き換えてください。
<div class="entry-title"><h2 class="entry-title">
<a href="<%topentry_link>"><%topentry_title>
<script type="text/javascript">
//<![CDATA[
nw(<%topentry_year>,<%topentry_month>,<%topentry_day>,<%topentry_hour>)
//]]>
</script></a></h2></div>


細かい編集を行いたい場合は、Danielさんの記事をご覧になったほうが早いかと思います。
スポンサーサイト

[!注意!]


この記事の情報は「やってみたらできた」というメモ程度の内容+古い情報です。Javascriptについての知識もあまり持ち合わせていないため、深い考察などもできていません。ご了承ください。

2010/02/10
さすがにメモ程度の内容で検索の上位に表示されてしまう(なぜ……)のはどうなの、ということで記事の改訂をしようと思ったのですが、既にかなり詳しく解説されているページがありましたのでそちらを紹介させていただきます。
ずっと工事中【IE6のmax-widthとmin-widthと、expressionについての覚え書き [CSS, JavaScript]】



古い情報です。取り扱いにご注意ください。


このエントリーでは、ページ全体の幅を下限・上限有りのリキッドレイアウトとすることを目的としたTipsの紹介をしていきます。

ClearTypeはWindows XP以降のOSに採用されているフォントのアンチエイリアシングです。XP以降のOSを使用している方のほとんどがClearTypeをONにしているんじゃないでしょうか。

ClearTypeは英文フォントに対して特に効果を発揮してくれるので、ClearTypeを利用しているとついつい英文フォントを使いたくなったりするのですが、ClearTypeが使える環境での表示に慣れてしまい、その環境でフォントやフォントサイズを選んでしまうと、ClearTypeが利用していない環境では「あれ…なんかフォントかっこわるい…」ということがあったりします。

一応、ClearTypeのON/OFFは設定で変更できるのですが、毎回そんなことをして表示を確かめるのもめんどくさい!

というわけで、この際ClearTypeがON/OFFでの表示の違いをまとめ、参照しやすいようにしてみよう思います。ただ、何だかんだいって面倒なので、調べるフォントは私がよく使う以下のフォントに限定しておきます。
・Arial
・Verdana
・Trebuchet MS
・Lucida Sans Unicode
・Century Gothic

関連記事:javascriptの荒波に

この記事から引き続きexpressionについて調べていたのですが、オライリーの本でexpressionについて触れてあるのを発見し、早速(Amazonで)購入ー。届くまでの間にもう少し調べたら、Web上でもオライリーの情報が少しのっていて、テストサイトなんかもありました。これはありがたい。

http://www.marlin-arms.com/support/hpws/index7.html
驚きなのは、リンク先にある「CSS expressionを使ったカウンタ」。
expressionが評価されるたびに数が増えていくのですが、増え方ハンパ無さ過ぎ。「増え方すごいよ。ほんとだよ」とは言われていたものの、確かにこりゃ重くなるなと納得の数値です。お試しあれ。
これ見たらますますイベントハンドラの必要性を感じました。

expression絡みで困ってること。
expression直下でwindow.onresizeが使えるかどうか
・window.onresizeだけで初表示時はだいじょーぶなのかどうか
悩みがふえた(-ω-;)

expressionについてはこちらも詳しくて参考になります。ありがたやー。
ダイナミックプロパティ expression() のまとめ (Snow-Materiaさん)

Webサイトの高速化 ルール7 CSSのExpression()は使わない!
ここの記事によると、expressionを使うとあらゆるイベントに対して評価が行われ、動作が遅くなってしまうのだそうです。

Nefertのテンプレートではmin-width・max-widthをIE6で適用させるためにexpressionを使っているのですが、この情報を元にイベントハンドラをつかってみよーと思ったのでした。

が、いかんせんjavascriptの知識は皆無に近いもんで(;'-')
あってるのかどうなのかすら分からない状態になってしまいました…(;'-')

expression内のjavascriptの記述はこんな感じです。
意図としては、ウィンドウサイズが変化したときにウィンドウサイズによってwidthを指定するという感じなのですが…
window.onresize = ( 
(document.documentElement.clientWidth > 1150)? "1150px" :
(document.documentElement.clientWidth < 600)? "600px" :
"auto")
javascriptに強い方、これってどーなんでしょうか。
ウィンドウサイズが変化したときだけではなく、ページを最初に読み込んだときにも幅を指定する必要があるので、onloadとかで入れ子?条件分け?したほうがいいのでしょうか。
一応動作確認した段階では問題なさげなのですが…(-ω-;)

問題なければこれを全テンプレートに適用させたいなと思いますー。



Recent Entries

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