jquery实现淡入淡出

最新推荐文章于 2023-12-14 19:51:15 发布

LQW_home

最新推荐文章于 2023-12-14 19:51:15 发布

阅读量872

点赞数

CC 4.0 BY-SA版权

分类专栏： 13k

本文链接：https://blog.youkuaiyun.com/LQW_java_home/article/details/74537433

13k 专栏收录该内容

53 篇文章

订阅专栏

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<html>
<head>
	<script type="text/javascript" src="${ctx }/static/js/jquery-1.9.1.min.js"></script>
	<style>
		#image{
			width: 100%;
			height: 100%;
			position: absolute;
			z-index: 10;
		}
		body{
			margin: 0px;
		}
		#content{
			width: 100%;;
			height: 100%;
			display: none;
			position: absolute;
			z-index: 0;
		}
	</style>
</head>
<body>
	<img alt="加载中..." src="${ctx }/static/images/2.jpg" id="image" />
	<div id="content">
		<h1>Welcome...</h1>
	</div>
</body>

<script type="text/javascript">
	$(function(){
		window.setTimeout("inAndOut()",2000);
		window.clearTimeout(t1);//去掉定时器 
		
	})
	
	function inAndOut(){
		$("#image").fadeOut(2000);
		$("#content").fadeIn(2000);
	}
</script>
</html>