Liên kết đổi màu khi rê chuột
| Đoạn mã để tạo hiệu ứng liên kết đổi màu khi rê chuột. |
Cách cài đặt
Bước 1: Copy mã CSS bên dưới và dán vào khu vực HEAD trên trang web của bạn
CSS
Code:
<style type="text/css">
.view_example
{
text-align: center;
width: 100%;
background-color: silver;
border: 1px solid silver;
}
</style>
Bước 2: Copy mã JavaScript bên dưới và dán vào khu vực HEAD trên trang web của bạn
JavaScript
Code:
<script language="JavaScript">
<!--
// By Jari Aarniala [foo@mbnet.fi]
if(navigator.appName == "Microsoft Internet Explorer" &&
parseInt(navigator.appVersion) >= 4){
ie4 = true;
}
else {
ie4 = false;
}
function changeColor(){
if(ie4){
what = window.event.srcElement;
if(what.className == "link"){
if(what.style.color == "green"){
what.style.color = "lime";
}
else {
what.style.color = "green";
}
}
else {}
}
}
document.onmouseover = changeColor;
document.onmouseout = changeColor;
// -->
</script>
Bước 3: Copy mã HTML bên dưới và dán vào khu vực BODY trên trang web của bạn
HTML
Code:
<a href="http://www.yahoo.com/" style="color: green; text-decoration: none; font-family: Verdana,Arial; font-weight: 700;" class="link">
Yahoo!</a>
<a href="http://www.altavista.digital.com/" style="color: green; text-decoration: none; font-family: Verdana,Arial; font-weight: 700;" class="link">
Altavista</a>
<a href="http://www.lycos.com/" style="color: green; text-decoration: none; font-family: Verdana,Arial; font-weight: 700;" class="link">
Lycos</a>
<a href="http://www.infoseek.com/" style="color: green; text-decoration: none; font-family: Verdana,Arial; font-weight: 700;" class="link">
Infoseek</a>
Demo: Liên kết đổi màu khi rê chuột
Theo javascriptbank