0

やあみんなIamは現在2つのライトボックスを使用しようとしていますが、すべてが正常に機能しています。ただし、iamが2を理解しようとしているのは、 http://lokeshdhakar.com/projects/lightbox2/のような境界線を取得して、色を変更するために例で取得した境界線を取得する方法です。これに関するどんな助けも素晴らしいでしょう。

html:

<div class = "image1">
<a href="images/image1.jpg" rel="lightbox[group]"><img src="images/image1t.jpg" /></a>
</div>
4

2 に答える 2

1

以下のコードを試してください

.image1 a {
background: none repeat scroll 0 0 rgba(255, 255, 255, 0.1);
border-radius: 4px 4px 4px 4px;
box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
display: block;
float: left;
line-height: 1em;
margin-right: 40px;
padding: 7px;
transition: all 0.2s ease-out 0s;
}
.image1 a:hover {
background-color: #8AD459;
}
于 2012-12-06T18:23:01.547 に答える
1

アンカーにcss3トランジションプロパティを設定してから、:hoverプロパティに設定すると、エフェクトが「アニメーション化」されます。

.image1 a {
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}


.image1 a:hover {
background-color: #8ad459;
-webkit-box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2), 0 1px 4px 0 rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2), 0 1px 4px 0 rgba(0, 0, 0, 0.5);
box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2), 0 1px 4px 0 rgba(0, 0, 0, 0.5);
}
于 2012-12-06T18:23:20.943 に答える