zoukankan      html  css  js  c++  java
  • 鼠标经过改变颜色

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>qwer</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><br /><input type="button" value="改变下面全部链接鼠标经过的颜色" onclick="changeHovertree('')" /><br />
          <a id="ahovertree" href="http://www.baidu.com" class="hovertree">原文</a>
            <input type="button" value="改变鼠标经过颜色" onclick="changeHovertree('ahovert'+'ree')" /><br />
          <a id="bhovertree" href="http://www.baidu.com/" class="hovertree">jQuery</a>
            <input type="button" value="改变鼠标经过颜色为粉色" onclick="changeHovertree('bhovertree', '', 'pink')" /><br />
          <a id="chovertree" href="http://www.baidu.com/"
          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://www.baidu.com/" class="hovertree">下雨特效</a>
            <input type="button" value="改变鼠标经过颜色" onclick="changeHovertree('eh'+'overtree')" /><br />
            <input type="button" value="改变页面中全部链接鼠标经过的颜色为浅灰色" onclick="changeAllHovertree('silver')" />
    </div>
    </body>
    </html>
  • 相关阅读:
    codevs 1792 分解质因数
    ScrollView嵌套ViewPager,ViewPager内容不显示问题
    AndroidStudio不重新运行,Debug调试已有进程
    Android进阶之Fragment与Activity之间的数据交互
    Android修改包名的方法,简单粗暴。
    android studio 按钮运行按钮后,不弹出选择运行模拟器的对话框
    RGB颜色值与十六进制颜色码转换工具
    Android Studio查看其它APP的布局结构
    android实现多条件筛选列表菜单筛选菜单
    Android,一条线串联实心圆布局
  • 原文地址:https://www.cnblogs.com/zjy954/p/5064755.html
Copyright © 2011-2022 走看看