この記事では、JSによるアニメーションの特殊効果のテキストリンクマウスホバープロンプトを実装する方法について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
次のようにコードをコピーします。
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = gb2312" />
<Title> JSテキストリンクマウスホバープロンプト効果を達成するためのアニメーション効果</タイトル>
</head>
<body>
<style type = "text/css">
<! -
。記事 {
国境底:黒い1pxソリッド;国境左:黒い1pxソリッド。国境右:黒い1pxソリッド。ボーダートップ:黒い1pxソリッド。フィルター:RevealTrans(transition = 23、duration = 0.5)blendtrans(duration = 0.5);位置:絶対;可視性:隠されています
;バックグラウンドカラー:#ffcc00;パディングトップ:3px;パディング右:3px;パディングボトム:3px;パディング左:3px}
- >
</style>
<スクリプト言語= javascript1.2>
<! -
関数show(divid){
divide.filters.revealtrans.apply();
divide.style.visibility = "visible";
divide.filters.revealtrans.play();
}
function hide(divid){
divide.filters.revealtrans.apply();
divide.style.visibility = "hidden";
divide.filters.revealtrans.play();
}
//->
</script>
<a href = "#" onmouseover = show(aaa)onmouseout = hide(aaa)> wulin.com </a> </div>
<div id = "aaa"> wulin.com </div> <br>
<a href = "#" onmouseover = show(bbb)onmouseout = hide(bbb)>マテリアルホーム</a> </div>
<div id = "bbb">マテリアルホーム</div> <br>
<a href = "#" onmouseover = show(ccc)onmouseout = hide(ccc)> baidu search </a> </div>
<div id = "ccc"> baidu search </div>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。