<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml" lang = "gb2312">
<Head>
<Title> static page turning effect implemented by CSS + JS </title>
<Style type = "text/css">
* {Font: normal 12px/1.5em "Microsoft YaHei", Tahoma; _ font: normal 12px/1.5em Tahoma;/* CSS Hack For IE6 */border: 0px; margin: 0px; padding: 0px; overflow: hidden; text-decoration: none; * text-overflow: ellipsis;/* CSS Hack For IE7 & IE6 */}
A {color: #333 ;}
A: hover {color: # 06c ;}
Body {background: # f3faff; text-align: center ;}
Ul {list-style-type: none ;}
Li {margin-bottom: 13px;/* CSS Hack For Firefox */* margin-bottom: 12px;/* CSS Hack For IE7 & IE6 */_ margin-bottom: 3%; /* CSS Hack For IE6 */white-space: nowrap ;}
# Main_News {/* background-color: teal; */border: 1px # acd0f0 solid; width: 445px; height: 402px ;}
# Content {width: pixel PX; height: 372px; margin: 10px 10px 0px 10px; _ margin: 10px 5px 0px 5px;/* CSS Hack For IE6 */overflow: hidden; text-align: left ;}
# Pages {width: 445px; height: 20px; margin: 0px; text-align: right ;}
</Style>
<Script defer = "defer" language = "javascript" type = "text/javascript">
<! --
Var _ offset = 0;
Function _ $ id (_ obj ){
Return document. getElementById (_ obj );
}
Function _ $ Pages (_ I ){
_ $ Id ("Content"). scrollTop = (_ $ id ("Content"). clientHeight * _ I );
AB = document. getElementById ("pages ")
Aa = AB. getElementsByTagName ("a"). length
For (k = 0; k <aa; k ++ ){
If (k = _ I) {AB. getElementsByTagName ("a") [k]. style. color = "red ";
} Else {
AB. getElementsByTagName ("a") [k]. style. color = "#000000"
}
}
}
Function _ $ InitPages (){
Var _ s = '';
_ Offset = _ $ id ("Content"). clientHeight;
Var _ top = _ $ id ("Content"). scrollTop;
For (var I = 0; I <(_ $ id ("Content"). scrollHeight/_ offset); I ++ ){
_ S + = ('<a href = "javascript: void (0);" onclick = "javascript: _ $ Pages (' + I + '); "onfocus =" this. blur () "title =" Page & nbsp; '+ (I + 1) +' "> '+ (I + 1) +' </a> & nbsp; & nbsp ;');
}
_ $ Id ("Pages"). innerHTML = _ s;
}
// -->
</Script>
</Head>
<Body onload = "_ $ InitPages ();">
<Div id = "Main_News">
<! -- Main news -->
<Div id = "Content">
<Ul>
<Li> <span class = "type"> [text and text] </span> notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> <span class = "type"> [Image and text] </span> notice on removing software such as stock trading chats </li>
<Li> <span class = "type"> [Image and text] </span> notice on removing software such as stock trading chats </li>
<Li> 1. Notice of the Scientific Research Office on the registration of Scientific Research Results </li>
<Li> 2 Notice on removing software such as stock trading chats </li>
<Li> 3 Notice on removing stock trading chat and other software </li>
<Li> 4. Notice of the Scientific Research Office on the registration of Scientific Research Results </li>
<Li> 5 notice on removing software such as stock trading chats </li>
<Li> 6 notice on removing software such as stock trading chats </li>
<Li> 7. Notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> 8. Notice on removing software such as stock trading chats </li>
<Li> 9 Notice on removing stock trading chats and other software </li>
<Li> 10 notice of the Scientific Research Office on the registration of Scientific Research Results </li>
<Li> 11 Notice on removing stock trading chats and other software </li>
<Li> 12 notice on removing stock trading chat and other software </li>
<Li> 13 notice of the Scientific Research Office on the registration of scientific research achievements </li>
<Li> 14 notice on removing stock trading chat and other software </li>
<Li> 15 Notice on removing software such as stock trading chats </li>
<Li> 16 notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> 17 notice on removing stock trading chat and other software </li>
<Li> 18 Notice on removing stock trading chats and other software </li>
<Li> 19 notice of the scientific research department on the registration of Scientific Research Results </li>
<Li> 20 notice on removing stock trading chats and other software </li>
<Li> 21 notice on removing stock trading chat and other software </li>
<Li> 23 Notice of the Scientific Research Office on the registration of scientific research achievements </li>
<Li> 24 notice on removing stock trading chats and other software </li>
<Li> 25 notice on removing stock trading chat and other software </li>
<Li> 26 Notice of the Scientific Research Office on the registration of scientific research achievements </li>
<Li> 27 notice on removing stock trading chats and other software </li>
<Li> 28 notice on removing stock trading chat and other software </li>
<Li> 29 notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> 30 Notice on removing stock trading chat and other software </li>
<Li> 31 notice on removing stock trading chats and other software </li>
<Li> 32. Notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> 33 notice on removing software such as stock trading chats </li>
<Li> 34 notice on removing stock trading chat and other software </li>
<Li> 35 notice of the scientific research department on the registration of Scientific Research Results </li>
<Li> 36 notice on removing software such as stock trading chats </li>
<Li> 37 Notice on removing stock trading chat and other software </li>
<Li> 38. Notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> 39 notice on removing software such as stock trading chats </li>
<Li> 40 Notice on removing software such as stock trading chats </li>
<Li> 41 Notice of the Scientific Research Office on the registration of Scientific Research Results </li>
<Li> 42 notice on removing stock trading chat and other software </li>
<Li> 43 Notice on removing shares chatting and other software </li>
<Li> 44 notice of the Scientific Research Office on scientific research achievement registration </li>
<Li> 45 notice on removing stock trading chat and other software </li>
<Li> 46 notice on removing stock trading chats and other software </li>
</Ul>
</Div>
<Div id = "Pages">
</Div>
</Div>
</Body>
</Html>
The paging effect is as follows:
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
