jquery - このホバー効果とは何か教えてもらえますか？

Question

私はこのページ（http://montreal.ubisoft.com/en/ubisoft-our-news）を見ていましたが、特定のボタンにカーソルを合わせると、このホバー効果にアクセスした他のページにも気づきました。私はこれがどのように行われたのか疑問に思っていました、css3またはJqueryUI？可能であれば、誰かが私をtutまたはプラグイン（Jqueryの場合）にリンクできますか？ありがとうございます;）

Answer 1

HTML

<input type="button" id="myButton" value="welcome to stackoverflow"/>

CSS

#myButton
{
    background-color:blue;
}
#myButton:hover
{
    background-color:red;
}

あなたの色を選択してください

正確な効果

HTML

 <div id="parentDiv">
        <a id="myButton" href="">Welcome to StackOverflow</a>
        <div id="transparentDiv"></div>
    </div>

CSS

#parentDiv
{
    position:relative;
    overflow:hidden;
}
#myButton
{
    display:block;
    height:70px;
    font-size:20px;
    text-decoration:none;
    text-align:center;
    color:white;
    background-color:red;
}
#transparentDiv
{
    position:absolute;
    top:0px;
    bottom:0px;
    right:0px;
    left:0px;
    background-color:black;
    opacity:0.7;
}

JQuery

$("#parentDiv").mouseenter(function(e){
    $("#transparentDiv").slideUp(500);
});
$("#parentDiv").mouseleave(function(e){
    $("#transparentDiv").slideDown(500);
});

それをチェックしてください：http：//jsfiddle.net/AliBassam/AzmUp/