JavaScript鼠标放在链接上实现字体放大效果

当前位置：首页 > 代码实例 > html5 css3代码分类 > 其他 > JavaScript鼠标放在链接上实现字体放大效果

本章节介绍一下当鼠标放在链接的时候改变链接文字的字体颜色和字体大小。

代码实例如下:

[ 其他 ] 运行代码下载代码

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.51qianduan.com/" />
<head>
<title>鼠标悬浮字体放大效果-51前端</title>
<style type="text/css"> 
body{ 
  font-family:Verdana; 
  font-size:9pt; 
  color:#000080 
} 
</style> 
<script type="text/javascript"> 
function linkOver(){ 
  this.style.color="red"; 
  this.style.fontSize="36px"; 
} 
function linkOut(){ 
  this.style.color="blue" 
  this.style.fontSize="12px"; 
} 
window.onload=function(){
  var mylink=document.getElementById("mylink");
  mylink.onmouseover=linkOver;
  mylink.onmouseout=linkOut;
}
</script> 
</head> 
<body> 
<a href="#" id="mylink">51前端</a>
</body> 
</html>

代码描述：JavaScript 鼠标链接字体放大效果。JavaScript鼠标放在链接上实现字体放大效果

下载全部收藏

389 519

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册