软件教程
超酷的首页模块拖曳效果代码
<!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=gb2312">
<title>网页特效 仿iGoogle模块拖曳效果 站长特效网</title>
<style type="text/css">
.spanDiv{position:relative;width:5px;height:5px;}
.www_zzjs_net,.nowww_zzjs_net{position:relative;filter:alpha(opacity=100);opacity:1;margin-bottom:6px;background-color:#FFFFFF;}
</style>
<script type="text/javascript" src="http://js.alixixi.com/img/20100928_zzjs.js"></script>
</head>
<body>
<table id="dragTable" cellpadding="3" style=" border:solid 0px green;width:98%;">
<tr>
<td valign="top" style="width:30%">
<div class="www_zzjs_net" id="www_zzjs_net1">
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue">
<tr id="titleBar1" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;">
<th align="left" unselectable="on">站长特效标题1</th>
</tr>
<tr style="height:130px;padding:3px;" align="left" valign="top">
<td unselectable="on"><a href="http://www.zzjs.net" target="_blank">站长特效网</a>， .打造国内最帅的网页特效站！</td>
</tr>
</table>
</div>
<div class="www_zzjs_net" id="www_zzjs_net2">
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue">
<tr id="titleBar2" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;">
<th align="left" unselectable="on">站长特效标题2</th>
</tr>
<tr style="height:130px;padding:3px;" align="left" valign="top">
<td unselectable="on"><a href="http://www.zzjs.net" target="_blank">站长特效网</a>，打造国内最帅的网页特效站！</td>
</tr>
</table>
</div>
</td>
<td valign="top" style="width:50%">
<div class="www_zzjs_net" id="www_zzjs_net3">
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue">
<tr id="titleBar3" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;">
<th align="left" unselectable="on">站长特效标题3</th>
</tr>
<tr style="height:230px;padding:3px;" align="left" valign="top">
<td unselectable="on"><a href="http://zzjs.net" target="_blank">站长特效网</a>，打造国内最帅的网页特效站！</td>
</tr>
</table>
</div>
</td>
<td valign="top" style="width:20%">
<div class="www_zzjs_net" id="www_zzjs_net4">
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue">
<tr id="titleBar4" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;">
<th align="left" unselectable="on">站长特效标题4</th>
</tr>
<tr style="height:130px;padding:3px;" align="left" valign="top">
<td unselectable="on"><a href="http://www.zzjs.net" target="_blank">站长特效网</a>，打造国内最帅的网页特效站.！</td>
</tr>
</table>
</div>
<div class="www_zzjs_net" id="www_zzjs_net5">
<table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue">
<tr id="titleBar5" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;">
<th align="left" unselectable="on">站长特效标题5</th>
</tr>
<tr style="height:130px;padding:3px;" align="left" valign="top">
<td unselectable="on"><a href="http://www.zzjs.net" target="_blank">.站长特效网</a>，打造国内最帅的网页特效站！</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</body>
</html>
-
·上一条：返回页面顶部的个性特效
·下一条：有效提升网站粘性减少跳出率的小技巧
