js实现动画特效的文字链接鼠标悬停提示的方法


Posted in Javascript onMarch 02, 2015

本文实例讲述了js实现动画特效的文字链接鼠标悬停提示的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>js实现动画效果的文字链接鼠标悬停提示效果</title>

</head>

<body>

<STYLE type="text/css">

<!--

.article { 

BORDER-BOTTOM: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; FILTER: revealTrans(transition=23,duration=0.5) blendTrans(duration=0.5); POSITION: absolute; VISIBILITY: hidden 

; background-color: #FFCC00; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px} 

-->

</STYLE>

<SCRIPT language=JavaScript1.2> 

<!-- 

function Show(divid) { 

divid.filters.revealTrans.apply(); 

divid.style.visibility = "visible"; 

divid.filters.revealTrans.play(); 

} 

function Hide(divid) { 

divid.filters.revealTrans.apply(); 

divid.style.visibility = "hidden"; 

divid.filters.revealTrans.play(); 

} 

//--> 

</script> 

<a href="#" onMouseOver=Show(aaa) onMouseOut=Hide(aaa)>三水点靠木</a></div>

   <div id="aaa" class="article">三水点靠木</div><br>

<a href="#" onMouseOver=Show(bbb) onMouseOut=Hide(bbb)>素材之家</a></div>

   <div id="bbb" class="article">素材之家</div><br>

<a href="#" onMouseOver=Show(ccc) onMouseOut=Hide(ccc)>百度搜索</a></div>

   <div id="ccc" class="article">百度搜索</div>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
Firefox window.close()的使用注意事项
Apr 11 Javascript
javascript 精粹笔记
May 09 Javascript
使用jQuery.Validate进行客户端验证(初级篇) 不使用微软验证控件的理由
Jun 28 Javascript
JavaScript实现快速排序(自已编写)
Dec 19 Javascript
使用JavaScript开发IE浏览器本地插件实例
Feb 18 Javascript
javascript中checkbox使用方法简单实例演示
Nov 17 Javascript
JS 事件绑定、事件监听、事件委托详细介绍
Sep 28 Javascript
jQuery网页定位导航特效实现方法
Dec 19 Javascript
基于JQuery和原生JavaScript实现网页定位导航特效
Apr 03 jQuery
在vue里使用codemirror遇到的问题
Nov 01 Javascript
webpack实践之DLLPlugin 和 DLLReferencePlugin的使用教程
Jun 10 Javascript
解决vue打包 npm run build-test突然不动了的问题
Nov 13 Javascript
JS实现点击文字对应DIV层不停闪动效果的方法
Mar 02 #Javascript
JavaScript定时显示广告代码分享
Mar 02 #Javascript
js实现绿白相间竖向网页百叶窗动画切换效果
Mar 02 #Javascript
js实现横向百叶窗效果网页切换动画效果的方法
Mar 02 #Javascript
js实现从中间开始往上下展开网页窗口的方法
Mar 02 #Javascript
Javascript无参数和有参数类继承问题解决方法
Mar 02 #Javascript
JS实现超炫网页烟花动画效果的方法
Mar 02 #Javascript
You might like
数据库的日期格式转换
2006/10/09 PHP
PHP 输出简单动态WAP页面
2009/06/09 PHP
总结PHP代码规范、流程规范、git规范
2018/06/18 PHP
解决laravel5.4下的group by报错的问题
2019/10/16 PHP
PHP编程一定要改掉的5个不良习惯
2020/09/18 PHP
JQuery slideshow的一个小问题(如何发现及解决过程)
2013/02/06 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
2013/08/02 Javascript
浅谈JavaScript中Date(日期对象),Math对象
2015/02/05 Javascript
使用纯javascript实现经典扫雷游戏
2015/04/23 Javascript
jquery插件splitScren实现页面分屏切换模板特效
2015/06/16 Javascript
js实现带圆角的多级下拉菜单效果
2015/08/28 Javascript
JS实现加载时锁定HTML页面元素的方法
2017/06/24 Javascript
JavaScript基本语法_动力节点Java学院整理
2017/06/26 Javascript
基于es6三点运算符的使用方法(实例讲解)
2017/10/12 Javascript
vue-router+nginx 非根路径配置方法
2018/06/30 Javascript
jQuery实现数字华容道小游戏(实例代码)
2020/01/16 jQuery
[02:52]2014DOTA2西雅图国际邀请赛 CIS战队巡礼
2014/07/07 DOTA
Python实现返回数组中第i小元素的方法示例
2017/12/04 Python
python实现协同过滤推荐算法完整代码示例
2017/12/15 Python
python3实现SMTP发送邮件详细教程
2018/06/19 Python
Python使用Selenium模块实现模拟浏览器抓取淘宝商品美食信息功能示例
2018/07/18 Python
python调用c++传递数组的实例
2019/02/13 Python
Pandas库之DataFrame使用的学习笔记
2019/06/21 Python
flask利用flask-wtf验证上传的文件的方法
2020/01/17 Python
Python进程的通信Queue、Pipe实例分析
2020/03/30 Python
python新手学习可变和不可变对象
2020/06/11 Python
CSS3 transform的skew属性值图文详解
2014/07/21 HTML / CSS
一款纯css3实现的tab选项卡的实列教程
2014/12/11 HTML / CSS
英国珠宝钟表和家居礼品精品店:David Shuttle
2018/02/24 全球购物
We Fashion荷兰:一家国际时装公司
2018/04/18 全球购物
泰国在线书店:SE-ED
2020/06/21 全球购物
英语系本科生个人求职信
2013/09/21 职场文书
医院门卫岗位职责
2013/12/30 职场文书
优秀电子工程系毕业生求职信
2014/05/24 职场文书
大一工商管理职业生涯规划:有梦最美,行动相随
2014/09/18 职场文书
2014年酒店服务员工作总结
2014/12/08 职场文书