php许愿墙开发视频教程，php许愿墙源码

1. 模版的制作
栏目 , 背景图
2.onclick 点击 获取发布留言的表单
<form action=”” method=”post”>
<table>
<tr>
<td class=”tdline1″>
收信人 :
</td>
<td>
<input type=”text” name=”addressee”>
</td>
</tr>
<tr>
<td class=”tdline1″> 内容 :</td>
<td>
<textarea name=”content” id=”” cols=”25″ rows=”5″></textarea>
</td>
</tr>
<tr>
<td class=”tdline1″>
发信人 :
</td>
<td>
<input type=”text” name=”sender”>
</td>
</tr>
<tr>
<td></td>
<td id=”sub”>
<input type=”submit” value=” 提交 “>
</td>
</tr>
</table>
</form>
function show() {
var tab = document.getElementsByTagName(‘table’)[0];
if(tab.style.display.indexOf(‘none’) > -1) {
tab.style.display = ‘block’;
} else {
tab.style.display = ‘none’;
}
}
3. 建表
create table lovewall (
id int primary key auto_increment,
addressee char(20) not null default ”,
content varchar(100) not null default ”,
sender char(20) not null default ”,
rtop smallint not null default 0,
rleft smallint not null default 0,
pic char(10) not null default ”
)engine=myisam default charset=utf8;
4.lw.php 可以发布留言 , 且直接在模版中显示最新留言$conn = mysql_connect(‘localhost’ , ‘root’ , ”);
mysql_query(‘use 1224php’ , $conn);
mysql_query(‘set names utf8’ , $conn);
$sql = “select * from lovewall”;
$rs = mysql_query($sql);
$data = array();
while($row = mysql_fetch_assoc($rs)) {
$data[] = $row;
}
//print_r($data);exit();
if(!empty($_POST)) {
$rtop = mt_rand(0 , 420);
$rleft = mt_rand(0 , 700);
$arr = array(‘o1.gif’ , ‘o2.gif’ , ‘o3.gif’);
$num = array_rand($arr);
$pic = $arr[$num];
$sql = “insert into lovewall (addressee,content,sender,rtop,rleft,pic) values
(‘$_POST[addressee]’,’$_POST[content]’,’$_POST[sender]’,$rtop,$rleft,’$pic’)”;
if(mysql_query($sql)) {
//echo ‘ok’;
$ref = $_SERVER[‘HTTP_REFERER’];
header(“Location:$ref”);
exit();
//echo $ref;
} else {
echo mysql_error();
}
}
require(‘./lw.html’);
5. 修改模版 , 循环的取出留言 , 且背景图不同
<div id=”content”>
<?php foreach($data as $d) {?>
<div class=”love” id=”a<?php echo $d[‘id’];?>” <?php echo ‘style=”z-index:0;background-image: url(./img/’ . $d[‘pic’].’);posit
<div class=”send”>
<?php echo $d[‘sender’];?>
</div>
<div class=”cont”>
<?php echo $d[‘content’];?>
</div>
<div class=”add”>
<?php echo $d[‘addressee’];?>
</div>
</div>
<?php }?>
</div>
6.z-index 点击哪个 div 就可以修改哪个 div 显示在最前方
<script>
var num = 0;
function show() {
var tab = document.getElementsByTagName(‘table’)[0];
if(tab.style.display.indexOf(‘none’) > -1) {
tab.style.display = ‘block’;
} else {
tab.style.display = ‘none’;
}
}function cli(test) {
num +=1;
test.style.zIndex = num;
}
</script>