2005年 3月 8日(火)   仏滅    今日は何の日?   

TopMovableTypeMTカスタマイズ > ブラウザを識別してフォントサイズを変えるワザ

MTカスタマイズブラウザを識別してフォントサイズを変えるワザ new

久しぶりに 骨のあるカスタマイズに挑戦!(^^*) ホホホホ
小粋空間 さま 「ユーティリティスクリプト(その1:フォントサイズ切り替え)」 です。
以前は InternetExplorer で アクセスすることが圧倒的に多かったのですが、最近 Firefox や Netscape で
やむやむを見る機会も多くなり、サイドメニューの ムシメガネが必要かしらん?・・・・と思うほどチマチマなフォントが
少々 気になってました。このスクリプトは まさに それを解消してくれるものなのです。
つまり、Firefox ・ Netscape といった Mozilla系ブラウザ で表示した時だけ フォントサイズを 大きめ (指定したサイズ) に
修正してくれる・・・・・ってわけです。これ、いいですよね。というわけで、早速 やってみたかったんだけど
サイドメニューを 一つ一つ モジュール化してることもあり、修正しなくちゃいけないテンプレートが たくさんになるので
なかなか思いきれず、今朝 たまたま 早く目が覚めたので やっと 着手したのでありまする。。。
はい、まず 小粋空間 さまのエントリ 内リンクから util.js をいただいてきたら、これを ローカル・サイト・パスに配置します。
そして、テンプレートの修正なんだけど・・・やむやむの場合、先に 折りたたみの起動スクリプトを入れてたので
そこに id 属性による指定(changeFontSizeById) の方法で 一行ずつ 追加しました。
例えば 「検索」 のテンプレートなら

<script type="text/javascript">
<!--
FoldNavigation('search','off',false);
changeFontSizeById(1, 'searchlist', '10px');
//-->
</script>

赤い字のところが 追加した一行です。メニューをツリー化してるところは この方法では うまくいかなかったので
id属性+内部タグ名による指定(changeFontSizeByIdAndTagName) の方法で やりました。
例えば 「カテゴリ一覧」 でしたら やむやむの場合、↓こんな感じ。
<script type="text/javascript">
<!--
FoldNavigation('category','off',true);
changeFontSizeByIdAndTagName(1, 'categorylist', 'ul', '10px');
//-->
</script>

最後に スクリプトを設定した各テンプレートの <head> ~ </head> の間に ↓のタグを追加してできあがり。
<script type="text/javascript" src="<$MTBlogURL$>util.js" charset="utf-8"></script>

これでもう、ムシメガネは要りませんね~♪ヽ( ̄▽ ̄)ノ


3月9日 追記です。サイドメニューにばかり気をとられてて、もう一箇所 フォントがチマチマなところを見落としてました。
Vote の欄です。(;^_^ A ・・・・かなりチマチマしてるぅ・・・・Vote の欄には id属性を指定してないので
タグ名+クラス属性名による指定(changeFontSizeByTagNameAndClassName) の方法を使いました。
<script type="text/javascript">
<!--
changeFontSizeByTagNameAndClassName(1, 'div', 'vote', '10px');
//-->
</script>

これでもう、見落としはないかなぁ。。。。(;¬_¬)   実はまだありました。↓続きを開いてみてね。

Posted by Caetla at 14:44 | Category : MTカスタマイズ | Comments [7] | Trackbacks [0] | Clip!! | Ranking
Tag : MovableType , カスタマイズ , ブラウザ識別 , スクリプト
この記事はどうでしたか?(お気軽に 記事に点数を付けてみてくださいね♪)
Bad ← 1 2 3 4 5 → Good
評定平均:(2.9) 総合点:(1479) 投票人数:(502)

エントリーURL


 

トラックバックURL


 

コメント
1

こんにちは。

動くBlogTimesの前に、「Powered by Movable Type」バナー風のBlogTimesを作ってみました。
以下のような感じで表示されます。

エントリーはこちらです。良かったらご覧ください。
http://www.h-fj.com/blog/archives/2005/03/powered_by_mova.php

Posted by ゲスト http://www.h-fj.com/blog at 2005年03月08日 16:18 [RES]
2

こんにちは。

コメント先を間違えてしまいました。すいませんです。

Posted by ゲスト http://www.h-fj.com/blog at 2005年03月08日 16:19 [RES]
3

>>2 壱さん
いえいえ・・・お知らせありがとうございます。
見に行こーーーーーっと。(((((((((((((ーー;) さささっ・・・

Posted by 管理人 さえら http://caetla.oops.jp/blog2/ at 2005年03月08日 16:40 [RES]
4

っと。
あ,なんとなくmixiで見た名前と一致し始めてきました
あ,なんとなくmixiで見た名前と一致し始めてきましたw
さえらひでー(ぉぃ Σ(゜Д゜)
まずそうに聞こえるからやめ
http://watcher.moe-nifty.com/hacks/2004/08/post_9.html

Posted by ゲスト 酢鶏@人工無能 at 2005年03月10日 06:40 [RES]
5

>>4 酢鶏@人工無能さん
なにがひでーーーーんだよーーーー。
ψ(`∇´)ψ うきょきょきょ

Posted by 管理人 さえら http://caetla.oops.jp/blog2/ at 2005年03月10日 06:52 [RES]
6

さえらしゃ~ん!
コレ、やってみようと思ったけどなんだか面倒くさいじゃん~ 泣

腰が重すぎて・・・・今日はダメダ~ |||

Posted by ゲスト ミッチ http://samua.s58.xrea.com/blog/ at 2005年04月05日 16:37 [RES]
7

>>6 ミッチさん
わかるぅ~~~。ミッチもサイドメニューをモジュール化してるよね?
だから、いじらないといけないテンプレートの数が 多くて 大変だと思うよー。
あたしも、覚悟決めて取り組みました。ヾ(☆▽☆) アハアハ
時間のあるときじゃないと、できないかも、途中になっちゃうからね。

Posted by 管理人 さえら http://caetla.oops.jp/blog2/ at 2005年04月05日 17:32 [RES]
Amazon Search
Google Similar