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 相关文章推荐
jQuery live( type, fn ) 委派事件实现
Oct 11 Javascript
javascript innerHTML使用分析
Dec 03 Javascript
jQuery中获取checkbox选中项等操作及注意事项
Nov 24 Javascript
节点的插入之append()和appendTo()的用法介绍
Jan 13 Javascript
浅谈javascript中call()、apply()、bind()的用法
Apr 20 Javascript
Js实现无刷新删除内容
Apr 29 Javascript
AngularJS入门教程之多视图切换用法示例
Nov 02 Javascript
javascript cookie的基本操作(添加和删除)
Jul 24 Javascript
提升页面加载速度的插件InstantClick
Sep 12 Javascript
vue结合element-ui使用示例
Jan 24 Javascript
react的滑动图片验证码组件的示例代码
Feb 27 Javascript
js前端如何写一个精确的倒计时代码
Oct 25 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
php生成随机数或者字符串的代码
2008/09/05 PHP
php下使用curl模拟用户登陆的代码
2010/09/10 PHP
解决PhpMyAdmin中导入2M以上大文件限制的方法分享
2014/06/06 PHP
在WordPress中使用wp-cron插件来设置定时任务
2015/12/10 PHP
PHP7 其他修改
2021/03/09 PHP
来自chinaz的ajax获取评论代码
2008/05/03 Javascript
Javascript学习笔记1 数据类型
2010/01/11 Javascript
jqPlot 图表中文API使用文档及源码和在线示例
2012/02/07 Javascript
JQuery 常用方法和事件详细介绍
2013/04/18 Javascript
js Map List 遍历使用示例
2013/07/10 Javascript
jQuery中element选择器用法实例
2014/12/29 Javascript
Jquery实现动态切换图片的方法
2015/05/18 Javascript
jQuery 1.9.1源码分析系列(十四)之常用jQuery工具
2015/12/02 Javascript
AngularJS自定义指令实现面包屑功能完整实例
2017/05/17 Javascript
详解Angular2 之 结构型指令
2017/06/21 Javascript
基于jQuery封装的分页组件
2017/06/26 jQuery
React-Native中props具体使用详解
2017/09/04 Javascript
javascrit中undefined和null的区别详解
2019/04/07 Javascript
Vue 实现前端权限控制的示例代码
2019/07/09 Javascript
[50:22]完美盛典-2018年度红毯走秀
2018/12/16 DOTA
Python制作简单的网页爬虫
2015/11/22 Python
python 根据pid杀死相应进程的方法
2017/01/16 Python
Python实现的井字棋(Tic Tac Toe)游戏示例
2018/01/31 Python
python合并已经存在的sheet数据到新sheet的方法
2018/12/11 Python
Django url,从一个页面调到另个页面的方法
2019/08/21 Python
python如何求100以内的素数
2020/05/27 Python
使用Python FastAPI构建Web服务的实现
2020/06/08 Python
css3学习之2D转换功能详解
2016/12/23 HTML / CSS
世界领先的电子书网站:eBooks.com(在线购买小说、非小说和教科书)
2019/03/30 全球购物
彪马荷兰官网:PUMA荷兰
2019/05/08 全球购物
顺丰快递Java软件工程师面试题
2015/07/31 面试题
失业者真诚求职信范文
2013/12/25 职场文书
教育科研先进个人材料
2014/01/26 职场文书
新闻编辑求职信
2014/04/09 职场文书
2015年七七事变78周年纪念活动方案
2015/05/06 职场文书
幼儿园语言教学反思
2016/02/23 职场文书