zoukankan      html  css  js  c++  java
  • animate css3 应用的借鉴,一个同事写的JS

    	  $("#banner").height($(window).height()-125);
    	   $(window).resize(function(){ 
    	   $("#banner").height($(window).height()-125);
         });   
    	//首页幻灯
    	$(".indeximgs:first").show();
    	
    	var i=0;
    	$(".leftbut").click(function(){
    			$(".indeximgs").hide();
    			i=i-1;
                             if (i==-1) {i=5}
    			$(".indeximgs:eq("+i+")").fadeIn(1000);
    		});
    		
    	$(".rightbut").click(function(){	
    			$(".indeximgs").hide();
                            i=i+1;
                              if (i==6) {i=0}	
    			$(".indeximgs:eq("+i+")").fadeIn(1000);                      
    		});
    	//logo动画效果
    	$("#logo").hover(
    	function(){
    			 $("#logo img").attr('src','img/logo1.jpg');
    	         $("#logo img").addClass('animated flipInY');
    		},
    	function(){
    		 $("#logo img").removeClass('flipInY');
    		 $("#logo img").addClass('animated flipInX');
    		  $("#logo img").attr('src','img/logo.jpg');
    	});
    
     	 //导航动画效果
    	 $("#guild ul li").hover(
    	 		function(){	$(this).addClass('animated pulse');},
    			function(){$(this).removeClass('pulse');}
    	 );
    	//banner出现时一次动画
    		$("#banner").addClass('animated fadeInDown');
    	//搜索事件
    		$("#sbut").hover(function(){$("#search").show();$("#search").removeClass('slideOutLeft'); $("#search").addClass('animated fadeInLeftBig');});
    		$("#closesearch").click(function(){setTimeout(function(){$("#search").hide();},1000);$("#search").addClass('animated slideOutLeft');$("#search").removeClass('fadeInLeftBig');});
    	//优化显示
    	$("#indexperson").css("visibility","hidden");
    	$("#huandeng").css("visibility","hidden");
    	$("#foot").css("visibility","hidden");
    
    	 $(document).ready(function(){
    		 $(window).bind("scroll", function(event){
    			 	if ($(window).scrollTop()>303 && $(window).scrollTop()<407) { 
    				$("#indexperson").css("visibility","visible");
    				$("#indexperson").addClass('animated fadeInUp');
    				//setTimeout(function(){$("#indexperson").removeClass('fadeInUp');},2000);
    				}
    			 	if ($(window).scrollTop()>515 && $(window).scrollTop()<930) { 
    				$("#huandeng").css("visibility","visible");
    				$("#huandeng").addClass('animated fadeInUp');
    				//setTimeout(function(){$("#huandeng").removeClass('fadeInUp');},2000);
    				}
    				if ($(window).scrollTop()>1300 && $(window).scrollTop()<1500) { 
    				$("#foot,#copyright").css("visibility","visible");
    				$("#foot,#copyright").addClass('animated fadeInUp');
    				//setTimeout(function(){$("#foot").removeClass('rotateInDownLeft');},2000);
    				}
    		 });
    		 
    	 
    		});
        
    

      同事做的网站sanbf.com的效果应用。。

  • 相关阅读:
    C#对象深度克隆(转)
    .Net Core 图片文件上传下载(转)
    事件总线(Event Bus)知多少(转)
    深入理解C#:编程技巧总结(一)(转)
    asp.net core源码飘香:Configuration组件(转)
    asp.net core源码飘香:Logging组件(转)
    基于C#.NET的高端智能化网络爬虫(下)(转)
    基于C#.NET的高端智能化网络爬虫(转)
    30分钟掌握 C#7(转)
    30分钟掌握 C#6(转)
  • 原文地址:https://www.cnblogs.com/qfly/p/4654648.html
Copyright © 2011-2022 走看看