6

私のウェブサイトには、ユーザーがリンクにカーソルを合わせるとすぐに移行する、ちょっとしたホバー効果があります。しかし、ユーザーがボックスの上にカーソルを置いたまま離れると、影 (およびその他の特性) はフェードアウトするのではなく、すぐに消えます。おそらくある種の :un-hover タイプの疑似クラスを使用して、プロパティをフェードインとフェードアウトの両方に取得する方法はありますか? ありがとう！それが役立つ場合は、CSS ブロックを次に示します。

a.squares:hover, a.squares:active {
    color: black;
    background-color: #E8E8E8;
    box-shadow: 0 0 12px black;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    -webkit-transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
    -moz-transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
    transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
}
4

1 に答える 1

6

トランジションをオンにしa.squaresないa.squares:hover

a.squares {
    -webkit-transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
    -moz-transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
    transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
}
a.squares:hover, a.squares:active {
    color: black;
    background-color: #E8E8E8;
    box-shadow: 0 0 12px black;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

トランジションについて出発したばかりのときに、まさにこのことを経験しました:)

于 2013-03-04T03:57:11.353 に答える