0

私のナビゲーションバーは、アイコンの上にマウスを置くまで、すべてがクリアになるようにサポートされています。次に、他のすべてのアイコンがぼやけるはずですが、現時点ではすべてのアイコンが最初からぼやけています。これを行う方法がわかりません。 http://dl.dropbox.com/u/13722201/Dorset%20Designs/index.html

投稿がうまくいかない場合は、cssソースも表示できると思います。 http://dl.dropbox.com/u/13722201/Dorset%20Designs/main.css

4

1 に答える 1

3

これは、CSS3（ブラウザーの制限がいくつかあります）とテキストシャドウ+トランジションを使用して行うことができます

http://jsfiddle.net/rlemon/sNQsy/ここに簡単なデモがあります（これは100％クロスブラウザではありません..つまり、たとえば、それを修正する方法を理解させます）。

これがソースコードです。

html 

<ul class="nav">
<li><a href="#">link one</a></li>
<li><a href="#">link two</a></li>
<li><a href="#">link three</a></li>
<li><a href="#">link four</a></li>
<li><a href="#">link five</a></li>
</ul>​

css

.nav {
 list-style:none;    
}
.nav li {
 float: left;
 padding: 2px 12px;
}
.nav li a {
 -webkit-transition: all 0.3s ease;
 -moz-transition: all 0.3s ease;
 -o-transition: all 0.3s ease;
 color: transparent;
 text-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.nav li:hover a {
 color: black;
 text-shadow: none; 
}​

ここにトランジションに関するいくつかの情報があり ます

ここに彼らがあなたに興味を持ってくれるcss変換についてのいくつかのより多くの読書があります

そしてここでテキストの影について

于 2012-06-24T17:37:57.123 に答える