首页 > 代码库 > jQuery点击变色的效果

jQuery点击变色的效果

  • jQuery 点击变色效果的代码实现,点击后文字所在方框的背景会变色,至于变成什么颜色,随你了,本代码的重点是效果的实现,并不局限于细节。

 

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><title>接触角测定仪</title></head><style type="text/css">        #t1,#t2,#t3,#t4{            height:30px;            width:50px;            background-color:#33FFFF;            float:left;            margin-left:50px;            text-align:center;        }        .active{background-color:#FC5A0A!important;}    </style>        <script type="text/javascript" src=http://www.mamicode.com/"http://www.codefans.net/ajaxjs/jquery1.3.2.js"></script>    <script type="text/javascript">        jQuery(function(){            var list = jQuery(#t1, #t2, #t3, #t4);            list.click(function(){                list.removeClass(active);                jQuery(this).addClass(active);                return false;            });        });    </script>    <body>        <div id="t1"><a href=http://www.mamicode.com/"#">1</a></div>        <div id="t2"><a href=http://www.mamicode.com/"#">2</a></div>        <div id="t3"><a href=http://www.mamicode.com/"#">3</a></div>        <div id="t4"><a href=http://www.mamicode.com/"#">4</a></div>    </body></html>