|
|
| Line 77: |
Line 77: |
| | #mainContent .titleTwo{ | | #mainContent .titleTwo{ |
| | text-align: left; | | text-align: left; |
| − | font-size: 25px; | + | font-size: 24px; |
| − | font-family: Helvetica,Arial,Tahoma,Verdana; | + | font-family: Arial,Verdana,Helvetica,Tahoma; |
| | font-weight: bold; | | font-weight: bold; |
| | line-height: 40px; | | line-height: 40px; |
| − | color:#626231; | + | color:#333; |
| | } | | } |
| − |
| |
| | #mainContent .contentP{ | | #mainContent .contentP{ |
| | text-align: justify; | | text-align: justify; |
| Line 99: |
Line 98: |
| | } | | } |
| | .imgName{ | | .imgName{ |
| − | font-size: 15px; | + | font-size: 14px; |
| | text-align:center; | | text-align:center; |
| | margin:5px; | | margin:5px; |
| − | line-height: 24px;
| |
| | } | | } |
| | | | |
| Line 128: |
Line 126: |
| | } | | } |
| | | | |
| − | /* big pic show css */
| |
| − | #showPicBac{
| |
| − | display:none;
| |
| − | position:fixed;
| |
| − | left:0px;
| |
| − | top:0px;
| |
| − | z-index:10001;
| |
| − | width:100%;
| |
| − | height:100%;
| |
| − | background:url(https://static.igem.org/mediawiki/2015/e/e7/China_Tongji-showPicBac.png);
| |
| − | text-align:center;
| |
| − | padding-top:100px;
| |
| − | }
| |
| − | #picAndWords{
| |
| − | background:#FFF;
| |
| − | width:200px;
| |
| − | height:200px;
| |
| − | overflow:hidden;
| |
| − | padding:20px;
| |
| − | margin:0px auto;
| |
| − | text-align:left;
| |
| − | }
| |
| − | #showPicTitle{
| |
| − | text-align: left;
| |
| − | font-size: 20px;
| |
| − | color:#333;
| |
| − | font-family: "Palatino Linotype", "MS Serif",Helvetica;
| |
| − | font-weight:bolder;
| |
| − | line-height:30px;
| |
| − | }
| |
| − | #picClose{
| |
| − | padding-top:5px;
| |
| − | }
| |
| | </style> | | </style> |
| | | | |
| Line 167: |
Line 132: |
| | <body> | | <body> |
| | | | |
| − | <!--动态展示大图-->
| |
| − | <div id="showPicBac">
| |
| − | <div id="picAndWords">
| |
| − | <p><img id="bigImage" src="" alt=""/></p>
| |
| − | <p class="showPicDown"><img class="hoverHand" id="picClose" src="https://static.igem.org/mediawiki/2015/9/95/China_Tongji-PicClose.gif" alt="close label" align="right"/><p id="showPicTitle"></p></p>
| |
| − | </div>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − | <!-- ---------------- script --------------- -->
| |
| − | <script type="text/javascript">
| |
| − | //文档就绪时触发
| |
| − | jQuery(document).ready(function($){
| |
| − | //大图展示
| |
| − | $('.bigImgShow').ready(function() {
| |
| − | $('.bigImgShow').click(function(){
| |
| − | var picWidth = parseInt(this.title.substring(0,3)); //parseInt将字符串转换为数字
| |
| − | var picHeight = parseInt(this.title.substring(4));
| |
| − | var windowHeight = $(window).height();
| |
| − | var paddingTop = (windowHeight-picHeight-83)/2;
| |
| − | $('#showPicBac').css("padding-top",paddingTop);
| |
| − | $('#showPicBac').css("display","block");
| |
| − | $('#bigImage').attr("src",this.src);
| |
| − | $('#bigImage').css("width",picWidth+"px");
| |
| − | $('#bigImage').css("height",picHeight+"px");
| |
| − | $('#showPicTitle').text(this.alt);
| |
| − | $('#picAndWords').animate({width:picWidth},750);
| |
| − | $('#picAndWords').animate({height:picHeight+43},300);
| |
| − | });
| |
| − | });
| |
| − | //关闭大图展示
| |
| − | $('#picClose,#showPicBac').click(function(){
| |
| − | $('#showPicBac').css("display","none");
| |
| − | $('#picAndWords').css("width","100px");
| |
| − | $('#picAndWords').css("height","100px");
| |
| − | });
| |
| − | });
| |
| − |
| |
| − | //---------------图片轮播控制函数--------------------//
| |
| − | function picMove(bannerTab,bannerCtrl,bannerPrev,bannerNext){
| |
| − | var bannerSlider = new Slider(bannerTab, {
| |
| − | time: 3000,
| |
| − | delay: 400,
| |
| − | event: 'hover',
| |
| − | auto: true,
| |
| − | mode: 'fade',
| |
| − | controller: bannerCtrl,
| |
| − | activeControllerCls: 'active'
| |
| − | });
| |
| − | bannerPrev.click(function() {
| |
| − | bannerSlider.prev()
| |
| − | });
| |
| − | bannerNext.click(function() {
| |
| − | bannerSlider.next()
| |
| − | });
| |
| − | }
| |
| − | //------------滚动条向下滚动超过一定距离时，内容列表固定在指定位置 函数-----------//
| |
| − | function fixContentList(scrollTop,contentList){
| |
| − | if( scrollTop >= 200 ) {
| |
| − | contentList.css("position","fixed");
| |
| − | contentList.css("top","78px");
| |
| − | } else {
| |
| − | contentList.css("position","static");
| |
| − | }
| |
| − | }
| |
| − | //----------侧边栏位置指示函数-----------------//
| |
| − | function locationFirstShow(scrollTop,firstST,list,listDrop){
| |
| − | if( (scrollTop<firstST-78) ){
| |
| − | list.css("color","#F0F");
| |
| − | listDrop.css("display","block");
| |
| − | }else{
| |
| − | list.css("color","#000");
| |
| − | listDrop.css("display","none");
| |
| − | }
| |
| − | } //第一个二级标题位置指示
| |
| − | function locationShow(scrollTop,firstST,secondST,list,listDrop){
| |
| − | if( (scrollTop>=firstST-78) ){
| |
| − | list.css("color","#F0F");
| |
| − | listDrop.css("display","block");
| |
| − | if(scrollTop>=secondST-78){
| |
| − | list.css("color","#000");
| |
| − | listDrop.css("display","none");
| |
| − | }}else{
| |
| − | list.css("color","#000");
| |
| − | listDrop.css("display","none");
| |
| − | }
| |
| − | } //中间的二级标题位置指示
| |
| − | function locationLastShow(scrollTop,lastST,list,listDrop){
| |
| − | if( (scrollTop>=lastST-78) ){
| |
| − | list.css("color","#F0F");
| |
| − | listDrop.css("display","block");
| |
| − | }else{
| |
| − | list.css("color","#000");
| |
| − | listDrop.css("display","none");
| |
| − | }
| |
| − | } //最后的二级标题位置指示
| |
| − | </script>
| |
| | </body> | | </body> |
| | | | |
| | </html> | | </html> |