a:hover でのナビゲーションの画像表示の変更方法
一枚のナビゲーション画像を、通常時とロールオーバー時で表示を切り替える方法として、サンプル用画像として、この画像を使用。
今回は上半分を通常時、下半分をロールオーバー時用として作成。(画像ロード時の切り替え時のタイムロスを少なくするため)
サンプル html(body内)
<ul>
<li class="testClassName1"><a href="#">ナビメニュー1</a></li>
</ul>
サンプル css
<style type="text/css">
<!--
.testClassName a {
display: block; /* a をブロック化し、 */
width: 100px; /* 幅の設定と */
height: 50px; /* 高さの設定 */
background: url(naviImg.gif) no-repeat center top; /* 通常時の背景画像(上半分)の設定 */
text-indent: -1000em; /* テキストをマイナスインデントで飛ばす */
}
.testClassName a:hover {
background: url(naviImg.gif) no-repeat center bottom; /* ロールオーバー時の背景画像(下半分)の設定 */}
-->
</style>
.htaccess ファイルは、サーバの挙動を決定する設定ファイルのひとつです。通常、サーバの設定は httpd.conf ファイル ( /usr/local/apache/conf/httpd.conf を探してください ) に記述しますが、このファイルはサーバ管理者しか編集できません。一方、.htaccess ファイルは各ユーザが、各ディレクトリ単位で設定できます。
htaccessの設定方法などはここでは省略し、 <meta http-equiv="refresh" ~ よりもスマートな、htaccess を使用したリダイレクト方法。
以下、とあるサイトからの引用
とすれば、http://www.shtml.jp/test/以下にあるファイルへのアクセスがあった場合には、リダイレクトされます。例えば、 http://www.shtml.jp/test/basic.htmlへのアクセスは、http: //www.shtml.jp/htaccess/basic.htmlへリダイレクトされます。Redirect permanent /test/ http://www.shtml.jp/htaccess/
また、画像などにも使用可能
などとします。RedirectMatch (.*)\.gif$ http://www.anotherserver.jp$1.jpg
ここで、正規表現を簡単に説明しますと、「括弧()」で囲まれた部分に入るものが$1に置き換えられます。
例えば、「http: //www.example.com/test/abc.gif」へのアクセスは「http://www.anotherserver.jp」と「$1 = /test/abc」と「.jpg」を合体させた「http://www.anotherserver.jp/test/abc.jpg」に転送されるという意味になります。
htaccess でリダイレクトの全文を読む
MT 4.2 になってから、デフォルトで設定されているタグクラウドのリンクが javascript になっているので、通常のリンクに修正する方法
<mt:If tag="Tags">
<div class="widget-tag-cloud widget">
<h3 class="widget-header">タグクラウド</h3>
<div class="widget-content">
<ul>
<mt:Tags top="20">
<li class="rank-<$mt:TagRank max="10"$>"><a href="<$mt:TagSearchLink encode_js="1"$>" rel="tag"><$mt:TagName$></a></li>
</mt:Tags>
</ul>
</div>
</div>
</mt:If>
...と、javascript の記述を外すだけでOK