HTML与php相结合的华丽效果

<?php
session_start();
?>
<!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;bcharset=utf-8" />
<script language="javascript" type="text/javascript">
<!--
var str="                  心灵鸡汤你值得拥有                                                 "
function a()
{str1=str.substr(0,1);
str2=str.substr(1);
str=str2+str1;
window.status=str;
document.title=str;
    }
    setInterval(a,600);
-->
</script>
<script language="javascript" type="text/javascript">
<!--
var str="心灵鸡汤你值得拥有 "
var i=0;
function m()
{
    document.getElementById("s1").style.left=Math.cos(i)*100;
    document.getElementById("s1").style.left=Math.sin(i)*100;
    document.getElementById("s1").style.fontSize=Math.random()*100;
    document.getElementById("s2").style.left=Math.cos(i/32)*100;
    document.getElementById("s2").style.left=Math.sin(i/32)*100;
    document.getElementById("s2").style.fontSize=Math.random()*200;
    i+=1;
    if(i==90) i=0;
    setTimeout("m()",150)
    }
    -->
</script>

<style type="text/css">
a:link {color:#FF9}
a:visited {color:#F0F}
a:hover {font-size: 150%}
a:active {color:#FF6}
.div1{
    position:absolute;
    width:100%px;
    height:30px;
    top:30px;
    left:509px
}
 .div2{
    position:absolute; background:#F9C;
    width:1117px;
    height:30px;
    top:0px;
    left:9px}
.div3{ background:none; position:absolute; top:90px; left:160px; width:180px; height:700px;}
.div4{ background:none; position:absolute; top:90px; left:340px; width:650px; height:700px;}
.div5{
    width:380px;
    height:240px;
    background-color:none;
    margin:5px;
    float:left;
    position:absolute;
    left:38px;
    top:21px;
    overflow:hidden;
}
.img{ width:380px; height:240px;}
.div-img{ width:380px; height:200px; top:5px; left:5px;}
.div6{
    width:70px;
    height:aoto;
    position:absolute;
    top:330px;
    float:right;
    right:516px;
    text-align:right;
}
.div7{ background:none; top:0px; left:10px; position:absolute;}
.div8{ background:none; position:absolute; top:0px; left:470px; width:180px; height:700px;}
.div9{
    background:none;
    position:absolute;
    top:275px;
    left:-180px;
    width:829px;
    height:460px;
}
.div10{
    background:#F9C;
    position:absolute;
    top:5px;
    left:856px;
    width:42px;
    height:23px;
}
.div11{ background:none; top:0px; left:0px; position:absolute; width:400px; height:20px;}
.div12{ background:none; position:absolute; top:40px; left:-20px; width:160px; height:200px;}
</style>
<body οnlοad="m()">
<center>
    <script language=JavaScript>
    <!-- [Step1]: 在此能够设置雨滴的多少 -->
    var rainsize = 40;
    <!-- [Step2]: 这里可以更改下雨的速度,数值大速度慢 -->
    var speed = 10;
    var x = new Array();
    var y = new Array();
    var r = new Array();
    var cx = new Array();
    var cy = new Array();
    var doc_width = document.body.clientWidth;
    var doc_height = document.body.clientHeight;
    for(i=0; i<rainsize; ++i) {
    initRain();
    if (i == 0) {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">");
    document.write(",</font></div>"); }
    else {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><font color=\"blue\">");
    document.write(",.</font></div>");  }
    }
    function initRain() {
    a = 6;
    r[i] = 1;
    sn = Math.sin(a);
    cs = Math.cos(a);
    cx[i] = Math.random() * doc_width + 1;
    cy[i] = Math.random() * doc_height + 1;
    x[i] = r[i] * sn + cx[i];
    y[i] = cy[i];
    }
    function raindropIE() {
    for (i = 0; i < rainsize; ++ i) {
    updateRain();
    if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
    makeRain();
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight; }
    document.all["dot"+i].style.pixelTop = y[i];
    document.all["dot"+i].style.pixelLeft = x[i]; }
    setTimeout("raindropIE()", speed);
    }
    function updateRain() {
    r[i] += 10;
    x[i] = r[i] * sn + cx[i];
    y[i] = r[i] * cs + cy[i];
    }
    function makeRain() {
    r[i] = 1;
    cx[i] = Math.random() * doc_width + 1;
    cy[i] = 1;
    x[i] = r[i] * sn + cx[i];
    y[i] = r[i] * cs + cy[i];
    }
    raindropIE();
    </script>
    
    <script language="JavaScript">
var numberofblossoms=15 //数量
var openblossomspeed=200 //速度
var showblossomstime=20  //停留时间

var frame=new Array()
frame[0]=new Image()
frame[0].src="http://www.webdm.cn/images/20091207/flower01.gif"
frame[1]=new Image()
frame[1].src="http://www.webdm.cn/images/20091207/flower02.gif"
frame[2]=new Image()
frame[2].src="http://www.webdm.cn/images/20091207/flower03.gif"
frame[3]=new Image()
frame[3].src="http://www.webdm.cn/images/20091207/flower04.gif"
frame[4]=new Image()
frame[4].src="http://www.webdm.cn/images/20091207/flower05.gif"
frame[5]=new Image()
frame[5].src="http://www.webdm.cn/images/20091207/flower06.gif"

var i_nownumberofframes=0
var i_maxnumberofframes=5
var i_numberofblossoms=0

var marginleft=0
var margintop=0
var marginbottom
var marginright

var timer
var thisblossom

showblossomstime=showblossomstime*1000

function positionblossoms() {
    if (document.all) {   
        marginbottom=document.body.clientHeight-40
        marginright=document.body.clientWidth-40    
        for (i=0;i<=numberofblossoms;i++) {     
            var randx=Math.floor(marginright*Math.random())
            var randy=Math.floor(marginbottom*Math.random())
            thisblossom=eval("document.all.blossom"+i+".style")
            thisblossom.posLeft=randx
            thisblossom.posTop=randy
            thisblossom.visibility="visible"
        }
        thisblossom=eval("blossom0")
        openblossoms()
    }
    
}

function openblossoms() {
    if (document.all) {
        clearTimeout(timer)
        if (i_nownumberofframes<=i_maxnumberofframes) {
            thisblossom.innerHTML="<img src='"+frame[i_nownumberofframes].src+"'>"
            i_nownumberofframes++
            timer=setTimeout("openblossoms()",openblossomspeed)
        }
        else  {
            clearTimeout(timer)
            i_nownumberofframes=0
            switchtonextblossom()
        }
    }
    
}

function switchtonextblossom() {
    if (document.all) {
        i_numberofblossoms++
        if (i_numberofblossoms<=numberofblossoms) {
            thisblossom=eval("blossom"+i_numberofblossoms)
            openblossoms()
        }
        else {
            setTimeout("hideblossoms()",showblossomstime)
        }
    }
    
}

function hideblossoms() {
    if (document.all) {
        for (i=0;i<=numberofblossoms;i++) {     
            thisblossom=eval("document.all.blossom"+i+".style")
            thisblossom.visibility="hidden"
        }
    }
    
}

if (document.all) {
    for (i=0;i<=numberofblossoms;i++) {
        document.write("<div id='blossom"+i+"' style='position:absolute;top:0px;left:0px;visibility:hidden;'><img name='blossomimg"+i+"' src='http://www.webdm.cn/images/20091207/flower01.gif'></div>")
        document.clear()
    }
}



window.οnresize=positionblossoms
window.οnlοad=positionblossoms

</script>

<div class="div2">
<p><font size="+1" color="#FFFFFF"><b>心灵鸡汤</b></font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font color="#FFFFFF" size="-1"><a href="shouye.php">主页</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="yingyong.php">应用首页</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="city.php">同城好友</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 搜应用</font>
  <input type="text" value="请输入应用名称" name="搜索" οnclick="" />
<div class="div10"><input type="submit" value="搜索" /></div></p>
</div>
<p align="center"><img src="图片/1.jpg" height="900px" width="1115px" />

<div class="div1">
<p align="center">
 <font color=black size="+3"><center><b>应用广场</b></center></font>
</p>
</div>
<div class="div3" align="center"><form method="post"><table width="150" border="0px" align="center">
<tr> <td width="150" height="35px" bgcolor="#FFCCFF"><a href="shouye.php">主页</a></td></tr>
<tr> <td width="150" height="35px" bgcolor="#FFCCCC"><a href="class.php">用户等级</a></td></tr>
<tr> <td width="150" height="35px" bgcolor="#FFCCFF"><a href="city.php">同城好友</a></td></tr>
<tr> <td width="150" height="35px" bgcolor="#FFCCCC"><a href="yingyong.php">应用首页</a></td></tr>
<tr> <td width="150" height="35px" bgcolor="#FFCCFF"><a href="#">我的应用</a></td></tr>
<tr> <td width="150" height="30px" bgcolor="#FFCCCC"><a href="http://www.zhzx.net.cn/teacher/teacherhome/wangjinli/chickensoup/souplist.htm">推荐网址</a></td></tr>
<tr><td width="160" height="35px" bgcolor="#FFCCFF"><input type="text" value="请输入网址"/><input type="reset" value="搜索" /></td></tr>
</table></form>
</div><div class="div4">
<div class="div7">
<div class="div11">
<marquee behavior="scroll" direction="left" scrollamount="10" scrolldelay="150">
<img src="图片/8.jpg" />
<font color="#FF66FF"><b>活动多多,奖品多多噢!</b></font>
</marquee></div></div>
<div class="div5">
<img src="图片/3.jpg" id="a1" class="img"/>
<div class="div-img">
<img src="图片/4.jpg" id="a2" class="img" />
<img src="图片/5.jpg" id="a3" class="img" />
<img src="图片/6.jpg" id="a4" class="img" />
<img src="图片/7.jpg" id="a5" class="img" />
</div>
</div>
<div class="div8">
<div class="div12">
<?php
#session_start();
echo $_SESSION["username"];
#$link=mysql_connect('localhost','root','123','work1')
#or die("不能连接数据库,原因".mysql_error());
#mysql_select_db('work')or die('不能选定数据库 work:'.mysql_error());


?>
<script language="javascript">

var now= new Date( );
var hour = now.getHours( );
if (hour>=0 && hour <=12)
    document.write("上午好!")
if (hour>12 && hour<= 18)
    document.write("下午好!");
if (hour>18 && hour <24)
    document.write("晚上好!");
document.write("<P>今天日期:"+now.getYear()+"年"+(now.getMonth( )+1)+"月"+now.getDate()+"日");
document.write("<P>现在时间:"+now.getHours()+"点"+now.getMinutes( )+"分"+now.getSeconds()+"秒");

</script>
</div>
</div>

<div class="div9">
<table width="830" border="1" cellspacing="0" cellpadding="2" style="border-style:dashed;">
  <tr>
    <td width="200" height="46" align="center"><center><font color="#000000" size="+2"><b>添加你的应用</b></font></center></td>
    <td width="330"><form action="yingyong.php?name=tijiao" method="post" name="a">应用编号<input type="text" name="bh"/> <input type="submit" value="提交" name="tj"/></form></td>
    <?php
    require"lianjie.php";

        if(isset($_GET["name"]) && $_GET["name"]=="tijiao")

{
    $r="insert into app(u_id,应用编号) values('".$_SESSION["userid"]."','".$_POST["bh"]."')";
    mysql_query($r);

}
    ?>
  </tr>
  <tr>
    <td height="360" colspan="3">
    <?php
$result=$mysqli->query("select 应用编号,应用名称,应用简介,应用积分 from yingyong");
echo'<table align="center" width="100%" border="1" style="border-style:dotted;" cellspacing="0" cellpadding="0">';
echo'<caption><h2>应用广场</h2></caption>';
echo'<td>应用编号</td><td>心灵鸡汤</td><td>应用简介</td><td>应用积分</td>';
while($row=$result->fetch_row()){
    echo'<tr>';
    foreach($row as $data)
    {echo'<td>'.$data.'</td>';}
echo'</tr>';
    }
    echo'</table>';
    
?>
</td>
    </tr>
</table>

</div>
</div>
<div class="div6"> <font color="#009900" size="+2"><a href="#a1">1</a><a href="#a2">2</a><a href="#a3">3</a><a href="#a4">4</a><a href="#a5">5</a></font></div>

</body>
</html>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值