zoukankan      html  css  js  c++  java
  • 显示与隐藏

    显示与隐藏

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		
    		<script type="text/javascript" src="jquery-3.4.1.js"></script>
    		<script type="text/javascript">
    			//动画显示
    			function testAnimate(){
    				$("div").animate({
    					height:"300px",
    					"500px"
    					
    				},3000,function(){
    					alert("加载完毕")
    				})
    			}
    			//动画
    			function testAnimate2(){
    				$("div").animate({
    					height:"20px",
    					"100px"
    					
    				},3000,function(){
    				})
    			}
    			//上划
    			function testSlideUp(){
    				$("div").slideUp()
    			}
    			//下拉
    			function testSlideDown(){
    				$("div").slideDown()
    			}
    			//显示
    			function testDisplayShow(){
    				$("div").css("display","block")
    			}
    			//隐藏
    			function testDisplayHide(){
    				$("div").css("display","none")
    			}
    			//显示
    			function testShow(){
    				$("div").show(3000);
    			}
    			//隐藏
    			function testHide(){
    				$("div").hide(3000)
    			}
    			//淡入
    			function testFadeIn(){
    				$("div").fadeIn();
    			}
    			//淡出
    			function testFadeOut(){
    				$("div").fadeOut();
    			}
    		</script>
    	</head>
    	<body>
    		<div>
    			hello div
    		</div>
    		<button onclick="testAnimate()">testAnimate</button>
    		<button onclick="testAnimate2()">testAnimate2</button><br />
    		<button onclick="testSlideUp()">testSlideUp</button>
    		<button onclick="testSlideDown()">testSlideDown</button><br />
    		<button onclick="testDisplayShow()">testDisplayShow</button>
    		<button onclick="testDisplayHide()">testDisplayHide</button><br />
    		<button onclick="testShow()">testShow</button>
    		<button onclick="testHide()">testHide</button><br />
    		<button onclick="testFadeIn()">testFadeIn</button>
    		<button onclick="testFadeOut()">testFadeOut</button>
    	</body>
    </html>
    
    
  • 相关阅读:
    qemu-kvm磁盘读写的缓冲(cache)的五种模式
    关于追踪qemu 源码函数路径的一个方法
    准备升大三啦
    关于Vim的一个配置文件
    POJ 3253
    hihocoder 第二十五周 spfa 最短路
    POJ 2718 穷举
    《鸟哥Linux私房菜基础学习篇》命令索引
    博文流
    《SDN核心技术剖析和实战指南》3.3读书笔记
  • 原文地址:https://www.cnblogs.com/x-i-n/p/12129757.html
Copyright © 2011-2022 走看看