jquery改变链接移上光标时的颜色实例

效果体验http://hovertree.com/texiao/jquery/18/完整代码如下:jquery设置a:hover颜色样式-何问起首页特效下面的链接,未访问的链接为蓝色,访问过的

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

全栈程序员社区此处内容已经被作者隐藏,请输入验证码查看内容
验证码:
请关注本站微信公众号,回复“验证码”,获取验证码。在微信里搜索“全栈程序员社区”或者“www_javaforall_cn”或者微信扫描右侧二维码都可以关注本站微信公众号。

效果体验http://hovertree.com/texiao/jquery/18/

完整代码如下:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jquery设置a:hover 颜色样式 - 何问起</title><base target="_blank" />
<meta charset="utf-8" />
<style type="text/css">
a{color:pink;font-size:32px}
a.hovertree{text-decoration:none;font-size:32px;color:blue}
a.hovertree:visited{color: #333333;}
a.hovertree:hover {
color: #00FF00;
text-decoration:underline;
}
</style>
<script src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script>
<script>
//改变全部链接颜色
function changeAllHovertree(color) {
if (color == undefined || color == "") color = "red";
$("a").on("mouseover", function () { $(this).css("color", color) }).on("mouseleave", function () { $(this).css("color", "") })

}
//改变指定链接颜色
function changeHovertree(idhovertree, classhovertree, color) {
if (color == undefined || color == "") color = "red";
if (classhovertree == undefined || classhovertree == "")
classhovertree = ".hovert" + "ree";
else
classhovertree = "." + classhovertree;
if (idhovertree == '')
$("a" + classhovertree).on("mouseover", function () { $(this).css("color", color) }).on("mouseleave", function () { $(this).css("color", "") })
else
$("#" + idhovertree).on("mouseover", function () { $("#" + idhovertree).css("color", color) }).on("mouseleave", function () { $("#" + idhovertree).css("color", "") })

}
</script>
</head>
<body>
<div>
<div>
<a href="http://hovertree.com">首页</a> <a href="http://hovertree.com/texiao/">特效</a><br /><br />
下面的链接,未访问的链接为蓝色,访问过的链接为黑色,鼠标经过时链接为绿色,改变颜色后鼠标经过为红色 或者设置的颜色。
</div><br /><input type="button" value="改变下面全部链接鼠标经过的颜色" onclick="changeHovertree('')" /><br />
<a id="ahovertree" href="http://hovertree.com/h/bjae/jqueryhover.htm" class="hovertree">原文</a>
<input type="button" value="改变鼠标经过颜色" onclick="changeHovertree('ahovert'+'ree')" /><br />
<a id="bhovertree" href="http://hovertree.com/menu/jquery/" class="hovertree">jQuery</a>
<input type="button" value="改变鼠标经过颜色为粉色" onclick="changeHovertree('bhovertree', '', 'pink')" /><br />
<a id="chovertree" href="http://hovertree.com/hvtart/bjae/e367418912caa0b8.htm" class="hovertree">JQuery实现锚点平滑滚动</a>
<input type="button" value="改变鼠标经过颜色" onclick="changeHovertree('chov'+'ertree')" /><br />
<a id="dhovertree" href="http://hovertree.com/hvtart/bjae/vgkgit00.htm" class="hovertree">哎呦,不错哦,JavaScript</a>
<input type="button" value="改变鼠标经过颜色" onclick="changeHovertree('dhover'+'tree')" /><br />
<a id="ehovertree" href="http://hovertree.com/hvtart/bjae/a6w6e2qg.htm" class="hovertree">下雨特效</a>
<input type="button" value="改变鼠标经过颜色" onclick="changeHovertree('eh'+'overtree')" /><br />
<input type="button" value="改变页面中全部链接鼠标经过的颜色为浅灰色" onclick="changeAllHovertree('silver')" />
</div>
</body>
</html>

相关内容: http://www.cnblogs.com/roucheng/p/texiao.html

visual studio

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/120685.html原文链接:https://javaforall.net

(0)
上一篇 2021年12月21日 下午4:00
下一篇 2021年12月21日 下午4:00


相关推荐

  • Java中throw和throws的区别

    Java中throw和throws的区别系统自动抛出的异常所有系统定义的编译和运行异常都可以由系统自动抛出 称为标准异常 并且 Java 强烈地要求应用程序进行完整的异常处理 给用户友好的提示 或者修正后使程序继续执行 nbsp 语句抛出的异常用户程序自定义的异常和应用程序特定的异常 必须借助于 throws 和 throw 语句来定义抛出异常 throw 是语句抛出一个异常 语法 throw 异常对象 nbsp nbsp nbsp nbsp nbsp nbsp nbsp nbsp thr

    2026年3月18日
    2
  • [LeetCode] Search in Rotated Sorted Array [35]

    [LeetCode] Search in Rotated Sorted Array [35]

    2022年1月29日
    67
  • JAVA学习笔记:目录

    JAVA学习笔记:目录目录java学习笔记1:了解java、JDK、JRE、JVMjava学习笔记2:JDK下载和安装以及测试控制台测试是否配置成功java学习笔记3:用记事本写第一个java程序,第一个java程序常见错误总结,第一个java程序详细解析java学习笔记4:常见的DOS命令和java开发工具java学习笔记5:eclipse的下载及使用,以及java程序的运行java学习笔记6:注释、标识…

    2022年10月7日
    7
  • 字节跳动:豆包大模型2.0正式发布

    字节跳动:豆包大模型2.0正式发布

    2026年3月12日
    2
  • java异或运算_异或校验

    java异或运算_异或校验异或运算常用来做数据的简单校验。Java的实现:(将字节数组两两异或,返回最后异或值)publicstaticbytegetXor(byte[]datas){ bytetemp=datas[0]; for(inti=1;i

    2022年10月5日
    4
  • TF-IDF算法介绍及实现「建议收藏」

    TF-IDF算法介绍及实现「建议收藏」目录1、TF-IDF算法介绍(1)TF是词频(TermFrequency)(2)IDF是逆向文件频率(InverseDocumentFrequency)(3)TF-IDF实际上是:TF*IDF2、TF-IDF应用3、Python3实现TF-IDF算法4、NLTK实现TF-IDF算法5、Sklearn实现TF-IDF算法6、Jieba实现TF-IDF算…

    2022年6月12日
    65

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号