页码修饰效果

最新推荐文章于 2024-09-22 11:17:00 发布

weixin_30338481

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量66

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/duhongyu216/archive/2012/02/27/2369379.html

版权

    <table>
<tr id="trPage">
<td><a href=''>1</a></td>
<td><a href=''>2</a></td>
<td><a href=''>3</a></td>
<td><a href=''>4</a></td>
<td><a href=''>5</a></td>
</tr>
</table>

CSS:

        #trPage td
{
            border: 1px solid #CCCCCC;
}
        #trPage a
{
            text-decoration: none;
}
        #trPage td:hover
{
            border: 1px solid #FF5500;
            background-color: #FFEEE5;
}

JAVASCRIPT(用jquery):

            var td_Clicked = null;
            $("#trPage td").mouseover(function () {
if (td_Clicked != null) {
                    $(this).css(page_MouseOver()).siblings().not(td_Clicked).css(page_MouseOut());
                }
            })
            .click(function () {
                $(this).addClass(page_MouseOver()).siblings().css(page_MouseOut());
                td_Clicked = $(this);
            });