<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>(＝。＝)</title>
<style type="text/css">
#Pic1 {
position:absolute;
width:1340px;
height:650px;
z-index:1;
left: 0px;
top: 0px;
visibility: visible;
}
#Button {
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
color: #FFF;
height: 61px;
width: 100px;
background-image: url(img/LogIn.png);
}
body {
overflow: hidden;
}
#Pic2 {
position:absolute;
width:1340px;
height:650px;
z-index:2;
left: 0;
top: 0;
visibility: hidden;
}
#Pic3 {
position:absolute;
width:1340px;
height:650px;
z-index:3;
left: 0;
top: 0;
visibility: hidden;
}
#apDiv1 {
position:absolute;
width:52px;
height:84px;
z-index:5;
left: 1290px;
top: 250px;
visibility: visible;
}
#next2 {
position:absolute;
width:52px;
height:84px;
z-index:5;
left: 1290px;
top: 250px;
visibility: hidden;
}
#next3 {
position:absolute;
width:52px;
height:84px;
z-index:5;
left: 1290px;
top: 250px;
visibility: hidden;
}
#LogIn {
position:absolute;
width:340px;
height:324px;
z-index:6;
left: 516px;
top: 149px;
visibility: visible;
background-color: #FFFFFF;
filter:alpha(Opacity=80);
-moz-opacity:0.5;
opacity: 0.6;
font-size: 24px;
}
#LogIn p {
text-align: center;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-weight: bold;
}
#Face {
position:absolute;
width:120px;
height:119px;
z-index:7;
left: 632px;
top: 82px;
visibility: visible;
}
#apDiv3 {
position:absolute;
width:248px;
height:184px;
z-index:1;
left: -82px;
top: 141px;
visibility: visible;
font-family: "方正兰亭超细黑简体";
font-size: 18px;
font-style: inherit;
text-transform: capitalize;
margin: 10px;
padding: 9px;
font-weight: bold;
}
input {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
height: 30px;
width: 180px;
clear: right;
float: left;
margin: 5px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #999;
border-right-color: #999;
border-bottom-color: #999;
border-left-color: #999;
position: static;
top: auto;
overflow: visible;
left: 9px;
right: auto;
bottom: auto;
color: #999;
}
#yourPassword {
position:static;
width:183px;
height:29px;
z-index:8;
left: -200px;
top: 0px;
visibility: visible;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#Face #apDiv3 #logInForm p #Go {
font-family: Tahoma, Geneva, sans-serif;
color: #FFF;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
position: absolute;
top: 149px;
right: auto;
background-color: #666;
height: 30px;
width: 78px;
visibility: visible;
font-size: 18px;
text-decoration: blink;
}
#Visit {
position:absolute;
width:107px;
z-index:8;
left: 117px;
top: 158px;
height: 45px;
font-weight: bold;
font-family: "幼圆";
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
font-size: 16px;
color: #FFF;
text-align: center;
text-decoration: none;
}
</style>
<script src="/SpryAssets/SpryEffects.js" type="text/javascript"></script>
<script type="text/javascript">
function MM_showHideLayers() { //v9.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3)
with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
obj.visibility=v; }
}
function MM_effectGrowShrink(targetElement, duration, from, to, toggle, referHeight, growFromCenter)
{
Spry.Effect.DoGrow(targetElement, {duration: duration, from: from, to: to, toggle: toggle, referHeight: referHeight, growCenter: growFromCenter});
}
function changePassword(){
var passWord = document.getElementById("password");
passWord.type="password";
passWord.value="";
passWord.onclick="";
}
</script>
</head>
<body>
<div id="Pic1"> <img src="img/pic1.jpg" name="pic1" width="1366" height="650" id="pic1" /></div>
<div id="Pic2"><img src="img/pic2.jpeg" name="pic2" width="1366" height="650" id="pic2" /></div>
<div id="Pic3"><img src="img/pic3.jpg" name="pic3" width="1366" height="650" id="pic3" /></div>
<div id="apDiv1" onclick="MM_showHideLayers('Pic1','','hide','pic1','','hide','Pic2','','show','pic2','','show','Pic3','','hide','pic3','','hide','apDiv1','','hide','next2','','show','next3','','hide');MM_effectGrowShrink('apDiv1', 1000, '100%', '90%', true, false, true)"><img src="img/next.png" alt="Next2" width="52" height="84" /></div>
<div id="next2" onclick="MM_showHideLayers('Pic1','','hide','pic1','','hide','Pic2','','hide','pic2','','hide','Pic3','','show','pic3','','show','apDiv1','','show','next2','','hide','next3','','show');MM_effectGrowShrink('next2', 1000, '100%', '80%', false, false, true)"><img src="img/next.png" alt="Next2" width="52" height="84" /></div>
<div id="next3" onclick="MM_showHideLayers('Pic1','','show','pic1','','show','Pic2','','hide','pic2','','hide','Pic3','','hide','pic3','','hide','apDiv1','','show','next2','','hide','next3','','hide');MM_effectGrowShrink('next2', 1000, '100%', '80%', false, false, true)"><img src="img/next.png" alt="Next2" width="52" height="84" /></div>
<div id="Face"><img src="img/Face.jpg" alt="facePic" name="facePic" width="120" height="120" id="facePic" />
<div id="apDiv3">
<form id="logInForm" name="logInForm" method="post" action="">
<p1>
<input name="User" type="text" id="User" tabindex="1" value="Please Enter Your Account" />
</p1>
<p> </p>
<h1>
<input name="password" type="text" id="password" tabindex="2" value="Your Password Here" Passwordchar='*' onclick="changePassword()"/>
</h1>
<div id="yourPassword" onfocus="MM_showHideLayers('yourPassword','','hide')" onclick="MM_showHideLayers('yourPassword','','hide')"></div>
<h1> </h1>
<p2></p2>
<p>
<input type="submit" name="Go" id="Go" value="LogIn" />
</p>
<div id="Visit"><a style=" text-decoration: none; color: #444;" tabindex="3">直接浏览→</a></div>
</form>
</div>
</div>
<div id="LogIn">
<p> </p>
<hr align="center" size="3" id="horizonLine" />
</div>
<div id="apDiv2"></div>
</body>
</html>
HTML-网页多媒体设计期末作业.zip
需积分: 0 5 浏览量
2023-12-31
14:20:14
上传
评论
收藏 7.58MB ZIP 举报
HTML-网页多媒体设计期末作业.zip （27个子文件） 
hongtaigshichi music 
BGM.mp3 5.84MB Type FZLTCXHJW.TTF 1.68MB _notes topOfFrame.html.mno 403B img pic2.jpeg 362KB
Your Password Here.png 868B button.png 1KB next.png 4KB
pic3.jpg 264KB pageHeadImg.jpg 17KB pic1.jpg 204KB Face.jpg 23KB top.png 2KB SpryAssets SpryValidationSelect.js 16KB SpryValidationPassword.css 2KB SpryValidationRadio.css 903B SpryValidationCheckbox.js 16KB SpryValidationTextField.css 3KB SpryValidationTextField.js 74KB SpryValidationSelect.css 2KB SpryValidationRadio.js 15KB SpryEffects.js 74KB SpryValidationCheckbox.css 1KB SpryValidationPassword.js 20KB favicon.ico 1KB
index.html 6KB Scripts 
expressInstall.swf 773B swfobject_modified.js 21KB资源评论
