JS paging effect example

Paging
Copy codeThe Code is as follows:
<Script type = "text/javascript" language = "javascript" src = "js/pager. js"> </script>

Copy codeThe Code is as follows:
/* -------- Pager -------*/
. Number span a {padding: 4px 6px ;}
. Number span a: hover {padding: 4px 6px; background-color: #999; color: # FFFFFF ;}
. Number {margin: 5px 0; font-size: 14px; font-weight: bold; color: # ff00ff ;}
. Number span {border: solid 1px # cccccc; background-color: # FFFFFF; color: #666666; line-height: 20px; display: inline-block; margin-left: 4px; margin-right: 4px ;}
# A_title {text-align: center; height: 30px; line-height: 30px; font-size: 18px; font-weight: bolder; display: block}
# A_smalltitle {font-size: 14px; font-weight: bolder; text-align: center; display: block ;}
. A_about {text-align: center; display: block; height: 20px; line-height: 20px; background: # F3F8F7}
# A_content {padding: 10px; height: auto; overflow: hidden; text-align: left; line-height: 200%; word-break: break-all ;}
# A_near {padding-left: 20px; margin: 5px 0; height: auto}

. Red {color: Red}

<P class = "nav">
<! -- Js pagination -->
<Script type = "text/javascript" language = "javascript">
Var pg = new showPages ('pg ');
Pg. pageCount = <% = PageCount %>;
Pg. printHtml ();
</Script>
</P>
</Div>

Public void Bind ()
{
Maticsoft. BLL. news bllnews = new Maticsoft. BLL. news ();
PagedDataSource ps = new PagedDataSource ();
Ps. DataSource = bllnews. GetAllList (). Tables [0]. DefaultView;
Ps. AllowPaging = true;
Ps. PageSize = 5; // page size
Ps. CurrentPageIndex = currentPage-1;
PageCount = ps. PageCount. ToString ();
R1.DataSource = ps;
R1.DataBind ();
}