• “腾讯分析”网站前端分析


    .fix-content-hover .computer-www,.computer:hover .computer-www{
    	-webkit-animation-name:show-word;
    	-webkit-animation-timing-function:ease-in-out;
    	-webkit-animation-duration:3s;
    	-moz-animation-name:show-word;
    	-moz-animation-timing-function:ease-in-out;
    	-moz-animation-duration:3s;
    }
    
    @-webkit-keyframes show-word{
    	0%{	
    		opacity:0;
    		0;
    		left:80px;
    	}
    	100%{
    		opacity:1;
    		178px;
    		left:130px;
    	}
    }
    @-moz-keyframes show-word{
    	0%{
    		opacity:0;
    		0;
    		left:80px;
    	}
    	100%{
    		opacity:1;
    		178px;
    		left:130px;
    	}
    }
    
    
    .fix-content-hover .stopwatch-pointer,.index2-pciture-bg:hover .stopwatch-pointer{
    	-webkit-animation-name:rotate;
    	-webkit-animation-timing-function:linear;
    	-webkit-animation-duration:1s;
    	-moz-animation-name:rotate;
    	-moz-animation-timing-function:linear;
    	-moz-animation-duration:1s;
    	-moz-transform-origin:14px 64px;
    	-webkit-transform-origin:14px 64px;
    	-moz-animation-iteration-count:1;
    	-webkit-animation-iteration-count:1;
    }
    
    @-webkit-keyframes rotate{
    	0%{	
    
    		-webkit-transform:rotate(0deg);
    		
    	}
    	100%{
    
    		-webkit-transform:rotate(360deg);
    	}
    }
    @-moz-keyframes rotate{
    	0%{
    
    		-moz-transform:rotate(0deg);
    	}
    	100%{
    
    		-moz-transform:rotate(360deg);
    	}
    }
    
    
    .fix-content-hover .man,.index3-pciture-bg:hover .man{
    	-webkit-animation:1s .2s ease-out both;
    	-moz-animation:1s .2s ease-out both;
       -webkit-animation-name:fadeInUp2;  
    	-moz-animation-name:fadeInUp2; 
    }
    @-webkit-keyframes fadeInUp2{
    	0%{
    	bottom:-100%;
    	}
    	100%{
    	bottom:0px;
    	}
    }
    @-moz-keyframes fadeInUp2{
    	0%{
    	bottom:-100%;
    	}
    	100%{
    	bottom:0px;
    	}
    }
    
    .fix-content-hover .group-man-left, .group2:hover .group-man-left{
    	-webkit-animation-name:fadeleft2;
    	-webkit-animation-timing-function:ease-in;
    	-webkit-animation-duration:1.5s;
    	-moz-animation-name:fadeleft2;
    	-moz-animation-timing-function:ease-in;
    	-moz-animation-duration:1.5s;
    }
    .fix-content-hover .group-man-right, .group2:hover .group-man-right{
    	-webkit-animation-name:faderight2;
    	-webkit-animation-timing-function:ease-in;
    	-webkit-animation-duration:1.5s;
    	-moz-animation-name:faderight2;
    	-moz-animation-timing-function:ease-in;
    	-moz-animation-duration:1.5s;
    }
    @-webkit-keyframes fadeleft2{
    	0%{
    	left:-10%;
    	opacity:0;
    	}
    	100%{
    	left:0px;
    	opacity:1;
    	}
    }
    @-moz-keyframes fadeleft2{
    	0%{
    	left:-10%;
    	opacity:0;
    	}
    	100%{
    	left:0px;
    	opacity:1;
    	}
    }
    @-webkit-keyframes faderight2{
    	0%{
    	right:-10%;
    	opacity:0;
    	}
    	100%{
    	right:0px;
    	opacity:1;
    	}
    }
    @-moz-keyframes faderight2{
    	0%{
    	right:-10%;
    	opacity:0;
    	}
    	100%{
    	right:0px;
    	opacity:1;
    	}
    }
    
    .fix-content-hover .monitor-heartbeat,.monitor:hover .monitor-heartbeat{
    	-webkit-animation-name:show2;
    	-webkit-animation-timing-function:ease-in-out;
    	-webkit-animation-duration:3s;
    	-moz-animation-name:show2;
    	-moz-animation-timing-function:ease-in-out;
    	-moz-animation-duration:3s;
    }
    .fix-content-hover .monitor-star,.monitor:hover .monitor-star{
    	-webkit-animation-name:star;
    	-webkit-animation-timing-function:ease-in-out;
    	-webkit-animation-iteration-count:2;
    	-webkit-animation-duration:2s;
    	-moz-animation-name:star;
    	-moz-animation-timing-function:ease-in-out;
    	-moz-animation-duration:2s;
    	-moz-animation-iteration-count:2;
    
    }
    
    
    @-webkit-keyframes show2{
    	0%{	
    		opacity:0;
    		0;
    	}
    	100%{
    		opacity:1;
    		407px;
    	}
    }
    @-moz-keyframes show2{
    	0%{
    		opacity:0;
    		0;
    	}
    	100%{
    		opacity:1;
    		407px;
    	}
    }
    @-webkit-keyframes star{
    	0%{	
    
    		opacity:0;
    		-webkit-transform:scale(1);
    	}
    	50%{
    		opacity:1;
    		-webkit-transform:scale(1.1);
    	}
    	100%{
    		opacity:0;
    		-webkit-transform:scale(1);
    	}
    }
    @-moz-keyframes star{
    	0%{
    		opacity:0;
    		-moz-transform:scale(1);
    	}
    	50%{
    		opacity:1;
    		-moz-transform:scale(1.1);
    	}
    	100%{
    		opacity:0;
    		-moz-transform:scale(1);
    	}
    }
    
    .fix-content-hover .action-bg-login{
    	-webkit-animation-name:fadeleft;
    	-webkit-animation-timing-function:ease-in;
    	-webkit-animation-duration:2s;
    	-moz-animation-name:fadeleft;
    	-moz-animation-timing-function:ease-in;
    	-moz-animation-duration:2s;
    }
    .fix-content-hover .action-bg-add{
    	-webkit-animation-name:faderight;
    	-webkit-animation-timing-function:ease-in;
    	-webkit-animation-duration:2s;
    	-moz-animation-name:faderight;
    	-moz-animation-timing-function:ease-in;
    	-moz-animation-duration:2s;
    }
    @-webkit-keyframes fadeleft{
    	0%{
    	left:-10%;
    	opacity:0;
    	}
    	100%{
    	left:0px;
    	opacity:1;
    	}
    }
    @-moz-keyframes fadeleft{
    	0%{
    	left:-10%;
    	opacity:0;
    	}
    	100%{
    	left:0px;
    	opacity:1;
    	}
    }
    @-webkit-keyframes faderight{
    	0%{
    	right:-10%;
    	opacity:0;
    	}
    	100%{
    	right:0px;
    	opacity:1;
    	}
    }
    @-moz-keyframes faderight{
    	0%{
    	right:-10%;
    	opacity:0;
    	}
    	100%{
    	right:0px;
    	opacity:1;
    	}
    }
    

      

    ; (function() {
        jQuery(document).ready(function($) {
            var FIX_CONTENT_HEIGHT = 442,
            LOGIN_HEIGHT = $('#div_login').height();
            function updateContent(index) {
                var st = $(document).scrollTop(),
                top = 0;
                top = LOGIN_HEIGHT + index * FIX_CONTENT_HEIGHT;
                scrollTo(top);
                return false;
            }
            function scrollTo(top) {
                var time = Math.abs(top - $(document).scrollTop());
                time = Math.min(Math.max(time, 500), 800);
                var body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $("html") : $("body")) : $("html,body");
                body.animate({
                    scrollTop: top
                },
                time);
            }
            function postToWb() {
                var _t = '';
                var _link = '';
                var _url = encodeURIComponent(_link);
                var _assname = encodeURI("");
                var _appkey = encodeURI("ce7fb946290e4109bdc9175108b6db3a");
                var _imgPath = '';
                var _pic = encodeURI(_imgPath);
                var _site = '';
                var _u = '';
                window.open(_u, '', 'width=700, height=680, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no');
            }
            $('#back-top,#btn_login').click(function() {
                sendHotClick('TAV2.Index.Button.' + this.id);
                scrollTo(0);
            });
            $('#ul_menu a').each(function(index) {
                $(this).attr('href', 'javascript:void(0);');
                $(this).click(function() {
                    sendHotClick('TAV2.Index.MenuBar.' + index);
                    if (index == 5) {
                        postToWb();
                    } else {
                        updateContent(index);
                    }
                    return false;
                });
            });
            $('#btn_addSite').click(function() {
                sendHotClick('TAV2.Index.Button.AddSite');
                document.location.href = '/bind/site';
            });
            $(window).scroll(function() {
                var st = $(document).scrollTop();
                if (st >= LOGIN_HEIGHT) {
                    $('#menubar').addClass('fix-menu-fixed');
                    $('#fix_wrapper .fix-content:first').addClass('fix-content-fixed');
                    $('#back-top').show();
                    for (var i = 4; i >= 0; i--) {
                        if (st >= (LOGIN_HEIGHT + i * FIX_CONTENT_HEIGHT)) {
                            $('#fix_wrapper .fix-content').removeClass('fix-content-hover');
                            $('#fix_wrapper .fix-content:eq(' + i + ')').addClass('fix-content-hover');
                            $('#ul_menu li').removeClass('current');
                            $('#ul_menu li:eq(' + i + ')').addClass('current');
                            if (i == 4) {
                                $('#fix_wrapper .fix-content:eq(5)').addClass('fix-content-hover');
                            }
                            break;
                        }
                    }
                } else {
                    $('#back-top').hide();
                    $('.fix-content').removeClass('fix-content-fixed');
                    $('#menubar').removeClass('fix-menu-fixed');
                }
            });
        });
    })();
    

      

  • 相关阅读:
    cookie与session的原理及区别
    jwt原则
    Django rest framework基础 RESTful风格
    vue项目使用整理
    Serializer 字段验证以及序列化
    ModelSerializer 字段验证以及序列化
    Django
    FREE 命令结果完全剖析
    一个一元二次方程求解编程引申的两个知识点(abs和fabs的区别以及浮点数比较相等)
    signed和unsigned之二
  • 原文地址:https://www.cnblogs.com/chenyongyang/p/7708292.html
Copyright © 2020-2023  润新知