Highlight image hover effect (opacity or borderize)

10月 30th, 2007 by admin Leave a reply »

ちょっと変わったhoverイベントの書き方をしていたののがあったのでメモ

Highlight image hover effect (opacity or borderize)

こちらの

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

<style type="text/css">
 
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
 
.toggleopacity img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-moz-opacity: 0.5;
}
 
.toggleopacity:hover img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity: 1;
}
 
.toggleopacity img{
border: 1px solid #ccc;
}
 
.toggleborder:hover img{
border: 1px solid navy;
}
 
.toggleborder:hover{
color: red; /* Dummy definition to overcome IE bug */
}
 
</style>

クラス名にhoverをかけている。
これを知らない私はonMouseイベントでjavaを組んでいました。。。

Posted in prototype

You can follow any responses to this entry through the RSS 2.0 Feed. You can leave a response , or trackback from your own site.

Advertisement

コメントを残す