JS实现鼠标滑过显示边框的菜单效果


Posted in Javascript onSeptember 21, 2016

本文实例讲述了JS实现鼠标滑过显示边框的菜单效果。分享给大家供大家参考,具体如下:

<html>
<head>
<title>JS鼠标滑过显示边框菜单</title>
</head>
<body>
<style>
.menulines{
border:1px solid white;
}
.menulines a{
text-decoration:none;
color:red;
}
</style>
<script language="JavaScript1.2">
function borderize(what,color){
what.style.borderColor=color
}
function borderize_on(e){
if (document.all)
source3=event.srcElement
else if (document.getElementById)
source3=e.target
if (source3.className=="menulines"){
borderize(source3,"black")
}
else{
while(source3.tagName!="TABLE"){
source3=document.getElementById? source3.parentNode : source3.parentElement
if (source3.className=="menulines")
borderize(source3,"black")
}
}
}
function borderize_off(e){
if (document.all)
source4=event.srcElement
else if (document.getElementById)
source4=e.target
if (source4.className=="menulines")
borderize(source4,"white")
else{
while(source4.tagName!="TABLE"){
source4=document.getElementById? source4.parentNode : source4.parentElement
if (source4.className=="menulines")
borderize(source4,"white")
}
}
}
</script>
<table border="0" width="150" cellspacing="0" cellpadding="0" onMouseover="borderize_on(event)" onMouseout="borderize_off(event)" height="95">
<tr><td width="100%" bgcolor="#E6E6E6" height="13"><b><font size="2">导航菜单</font></b></td></tr>
<tr><td width="100%" class="menulines" height="14"><a href="#">网页特效</a></td></tr>
<tr><td width="100%" class="menulines" height="14"><a href="#">学习教程</a></td></tr>
<tr><td width="100%" class="menulines" height="14"><a href="#">网页素材</a></td></tr>
<tr><td width="100%" class="menulines" height="14"><a href="#">软件下载</a></td></tr>
<tr><td width="100%" class="menulines" height="14"><a href="#">平面设计</a></td></tr>
</table>
</body>
</html>

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

Javascript 相关文章推荐
jQuery的强大选择器小结
Dec 27 Javascript
js写一个弹出层并锁屏效果实现代码
Dec 07 Javascript
Extjs4 关于Store的一些操作(加载/回调/添加)
Apr 18 Javascript
事件委托与阻止冒泡阻止其父元素事件触发
Sep 02 Javascript
node.js中的fs.rmdirSync方法使用说明
Dec 16 Javascript
基于javascript实现简单计算器功能
Jan 03 Javascript
Bootstrap创建可折叠的组件
Feb 23 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(三)
Sep 14 Javascript
微信小程序 POST请求(网络请求)详解及实例代码
Nov 16 Javascript
基于Node.js的大文件分片上传示例
Jun 19 Javascript
vue.js封装switch开关组件的操作
Oct 26 Javascript
js删除指定位置超链接中含有百度与360的标题
Jan 06 Javascript
JS 动态判断PC和手机浏览器实现代码
Sep 21 #Javascript
详解AngularJs中$resource和restfu服务端数据交互
Sep 21 #Javascript
AngularJS通过$http和服务器通信详解
Sep 21 #Javascript
JavaScript 拖拽实例代码
Sep 21 #Javascript
Angularjs中controller的三种写法分享
Sep 21 #Javascript
jQuery中Find选择器用法示例
Sep 21 #Javascript
jQuery实现点击后高亮背景固定显示的菜单效果【附demo源码下载】
Sep 21 #Javascript
You might like
利用php实现禁用IE和火狐的缓存问题
2012/12/03 PHP
PHP中十六进制颜色与RGB颜色值互转的方法
2019/03/18 PHP
javascript 一个自定义长度的文本自动换行的函数
2007/08/19 Javascript
常用的javascript function代码
2008/05/23 Javascript
js 获取input点选按钮的值的方法
2014/04/14 Javascript
Node.js安装教程和NPM包管理器使用详解
2014/08/16 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
2015/06/01 Javascript
javascript实现相同事件名称,不同命名空间的调用方法
2015/06/26 Javascript
浅析JS异步加载进度条
2016/05/05 Javascript
JQuery点击行tr实现checkBox选中的简单实例
2016/05/26 Javascript
jQuery实现字符串全部替换的方法【推荐】
2017/03/09 Javascript
详谈表单重复提交的三种情况及解决方法
2017/08/16 Javascript
浅谈函数调用的不同方式,以及this的指向
2017/09/17 Javascript
js 只比较时间大小的实例
2017/10/26 Javascript
Js中使用正则表达式验证输入是否有特殊字符
2018/09/07 Javascript
简单了解Ajax表单序列化的实现方法
2019/06/14 Javascript
JavaScript中继承原理与用法实例入门
2020/05/09 Javascript
Python Socket传输文件示例
2017/01/16 Python
python下读取公私钥做加解密实例详解
2017/03/29 Python
python处理数据,存进hive表的方法
2018/07/04 Python
python 反向输出字符串的方法
2018/07/16 Python
使用python绘制3维正态分布图的方法
2018/12/29 Python
使用pycharm在本地开发并实时同步到服务器
2019/08/02 Python
在macOS上搭建python环境的实现方法
2019/08/13 Python
python web框架 django wsgi原理解析
2019/08/20 Python
Python3安装pip工具的详细步骤
2019/10/14 Python
利用Python的sympy包求解一元三次方程示例
2019/11/22 Python
Python+redis通过限流保护高并发系统
2020/04/15 Python
python 字典item与iteritems的区别详解
2020/04/25 Python
Python根据字典的值查询出对应的键的方法
2020/09/30 Python
如何用用Python将地址标记在地图上
2021/02/07 Python
澳大利亚设计的婴儿和女孩的衣服:Oobi
2018/12/16 全球购物
十佳家长事迹材料
2014/08/26 职场文书
入党积极分子党支部意见
2015/06/02 职场文书
MySQL系列之一 MariaDB-server安装
2021/07/02 MySQL
浅谈TypeScript 索引签名的理解
2021/10/16 Javascript