前一段时间帮助一个老师做了个网站，再设计的过程中，由于做过的不多，所以遇到了很多问题！但是后来都解决了，我还是学到一些意外的收获……
首先对于网站自己应该有个定位（什么类型的网站，涉及到哪些内容）这些自己必须清楚。我们当初做的时候由于首先没有了解清楚，做了一些，老师不满意，后来看了一些类型差不多的，才有所收获。
第二，做的时候不能急，好多东西虽然现在做着你觉得满意，但是有时候到后面就会感觉不太搭配，所以应该多想些在做。
第三，考虑到团队的合作问题，了解自己的角色，是的！这个很重要，在完成任务的时候必须要注意到这些，因为这个关于到很多细节任务分配问题，因为如果你是个重要的负责人的话，就必须考虑很多问题。
最后一点就是必须不断的了解到任务的内容，以及这个任务完成的满意及不满意地方，这个会节约很多时间和精力，因为这是给别人做项目，别人的想法及意见时很重要的……
下面是我在做的过程整理的一些东西
@@1@@一个功能菜单（转别人的，不过确实很好）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="keywords" content="">
<style type=text/css>
body {
background:#799AE1;
margin:0px;
font:normal 12px 宋体;
background-color: #339900;
}
table { border:0px; }
td { font:normal 12px 宋体; }
img { vertical-align:bottom; border:0px; }
a { font:normal 12px 宋体; color:#215DC6; text-decoration:none; }
a:hover { color:#428EFF }
.sec_menu { border-left:1px solid white; border-right:1px solid white; border-bottom:1px solid white; overflow:hidden; background:#D6DFF7; }
.menu_title { }
.menu_title span { position:relative; top:2px; left:8px; color:#215DC6; font-weight:bold; }
.menu_title2 { }
.menu_title2 span { position:relative; top:2px; left:8px; color:#428EFF; font-weight:bold; }
</style>
<script language=javascript>
function menuShow(obj,maxh,obj2)
{
if(obj.style.pixelHeight<maxh)
{
obj.style.pixelHeight+=maxh/20;
obj.filters.alpha.opacity+=5;
obj2.background="./title_bg_hide.gif";
if(obj.style.pixelHeight==maxh/10)
obj.style.display='block';
myObj=obj;
myMaxh=maxh;
myObj2=obj2;
setTimeout('menuShow(myObj,myMaxh,myObj2)','0');
}
}
function menuHide(obj,maxh,obj2)
{
if(obj.style.pixelHeight>0)
{
if(obj.style.pixelHeight==maxh/20)
obj.style.display='none';
obj.style.pixelHeight-=maxh/20;
obj.filters.alpha.opacity-=5;
obj2.background="./title_bg_show.gif";
myObj=obj;
myMaxh=maxh
myObj2=obj2;
setTimeout('menuHide(myObj,myMaxh,myObj2)','0');
}
else
if(whichContinue)
whichContinue.click();
}
function menuChange(obj,maxh,obj2)
{
if(obj.style.pixelHeight)
{
menuHide(obj,maxh,obj2);
whichOpen='';
whichcontinue='';
}
else
if(whichOpen)
{
whichContinue=obj2;
whichOpen.click();
}
else
{
menuShow(obj,maxh,obj2);
whichOpen=obj2;
whichContinue='';
}
}
</script>
<base target=main>
</head>
<body onselectstart="return false;" οndragstart="return false;" οncοntextmenu="return false;">
<table cellpadding=0 cellspacing=0 width=158 align=center>
<br>
<tr style="cursor:hand;">
<td height=42 valign=bottom>
</td>
</tr>
</table>
<table cellpadding=0 cellspacing=0 width=158 align=center>
<tr style="cursor:hand;">
<td height=25 class=menu_title οnmοuseοver=this.className='menu_title2'; οnmοuseοut=this.className='menu_title'; background=./title_bg_hide.gif id=menuTitle1 onClick="menuChange(menu1,80,menuTitle1);">
<span>教学队伍</span>
</td>
</tr>
<tr>
<td>
<div class=sec_menu style="width:158px;height:80px;filter:alpha(Opacity=100);overflow:hidden;" id=menu1>
<table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
<tr>
<td height=20>
<a href="jiaoxueduiwu_1.html" target="zj">课程负责人与主讲教师</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxueduiwu_2.html" target="zj">教师队伍及整体素质</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxueduiwu_3.html" target="zj">教学改革与教学研究</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<script language=javascript>
var whichOpen=menuTitle1;
var whichContinue='';
</script>
<table cellpadding=0 cellspacing=0 width=158 align=center>
<tr style="cursor:hand;">
<td height=25 class=menu_title οnmοuseοver=this.className='menu_title2'; οnmοuseοut=this.className='menu_title'; background=./title_bg_show.gif id=menuTitle2 onClick="menuChange(menu2,80,menuTitle2);">
<span>教学内容</span>
</td>
</tr>
<tr>
<td>
<div class=sec_menu style="width:158;height:0;filter:alpha(Opacity=0);display:none;" id=menu2>
<table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
<tr>
<td height=20>
<a href="jiaoxueneirong_1.html" target="zj">理论课程内容</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxueneirong_2.html" target="zj">实践课程内容</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxueneirong_3.html" target="zj">教学内容组织</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<table cellpadding=0 cellspacing=0 width=158 align=center>
<tr style="cursor:hand;">
<td height=25 class=menu_title οnmοuseοver=this.className='menu_title2'; οnmοuseοut=this.className='menu_title'; background=./title_bg_show.gif id=menuTitle3 onClick="menuChange(menu3,80,menuTitle3);">
<span>教学条件</span>
</td>
</tr>
<tr>
<td>
<div class=sec_menu style="width:158;height:0;filter:alpha(Opacity=0);display:none;" id=menu3>
<table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
<tr>
<td height=20>
<a href="jiaoxuetiaojian_1.html" target="zj">教材及相关资料</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxuetiaojian_2.html" target="zj">实践教学条件</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxuetiaojian_3.html" target="zj">网络教学环境</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<table cellpadding=0 cellspacing=0 width=158 align=center>
<tr style="cursor:hand;">
<td height=25 class=menu_title οnmοuseοver=this.className='menu_title2'; οnmοuseοut=this.className='menu_title'; background=./title_bg_show.gif id=menuTitle4 onClick="menuChange(menu4,80,menuTitle4);">
<span>教学方法与手段</span>
</td>
</tr>
<tr>
<td>
<div class=sec_menu style="width:158;height:0;filter:alpha(Opacity=0);display:none;" id=menu4>
<table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
<tr>
<td height=20>
<a href="jiaoxuefangfa_1.html" target="zj">教学设计</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxuefangfa_2.html" target="zj">教学方法</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxuefangfa_3.html" target="zj">教学手段</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<table cellpadding=0 cellspacing=0 width=158 align=center>
<tr style="cursor:hand;">
<td height=25 class=menu_title οnmοuseοver=this.className='menu_title2'; οnmοuseοut=this.className='menu_title'; background=./title_bg_show.gif id=menuTitle5 onClick="menuChange(menu5,80,menuTitle5);">
<span>教学效果</span>
</td>
</tr>
<tr>
<td>
<div class=sec_menu style="width:158;height:0;filter:alpha(Opacity=0);display:none;" id=menu5>
<table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
<tr>
<td height=20>
<a href="zhuanjiapingjia.htm" target="zj">校内外专家评价</a>
</td>
</tr>
<tr>
<td height=20>
<a href="xueshengpingjia.htm" target="zj">学生评价意见</a>
</td>
</tr>
<tr>
<td height=20>
<a href="jiaoxueluxiang.htm" target="zj">教学录像资料</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<table cellpadding=0 cellspacing=0 width=158 align=center>
<tr style="cursor:hand;">
<td height=25 class=menu_title οnmοuseοver=this.className='menu_title2'; οnmοuseοut=this.className='menu_title'; background=./title_bg_show.gif id=menuTitle6 onClick="menuChange(menu6,80,menuTitle6);">
<span>特色及辐射共享</span>
</td>
</tr>
<tr>
<td>
<div class=sec_menu style="width:158;height:0;filter:alpha(Opacity=0);display:none;" id=menu6>
<table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;">
<tr>
<td height=20>
<a href="kechengtese.htm" target="zj">课程特色</a>
</td>
</tr>
<tr>
<td height=20>
<a href="xuexiaozhengce.htm" target="zj">学校政策</a>
</td>
</tr>
<tr>
<td height=20>
<a href="fushegongxiang.htm" target="zj">辐射共享</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</body>
</html>
是个很不错的功能菜单，具有折叠功能，如果借用的话，可以直接改写代码！但是一定要尊重原创……
@@2@@翻页程序
我先说明下我的这个休要翻页的是些截图，因为我们在网页中想显示word文档的内容，但是很多情况下这些都是有些难度的，要不编写网页，关键是我们的word内容太长，所以我们想到了截图，使用截图来显示内容，同时使用表格来插入图片，这样很轻松的完成很多工作！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>申报材料</TITLE>
<style>
body, td{
font-size: 9pt;
}
a:link {
color: #FF0000;
}
a:visited {
color: #FF0000;
}
a:hover {
color: #006600;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
var record = 1;//每页显示多少条记录
var count = 23;//记录总数
var pageTotal = ((count+record-1)/record)|0;//总页数
var pagenum = 1;//将要显示的页码
Cookie = {
Get : function (){
var returnValue=document.cookie.match(new RegExp("[/b/^;]?" + arguments[0] + "=([^;]*)(?=;|/b|$)","i"));
return returnValue?unescape(returnValue[1]):returnValue;
}
}
String.prototype.format = function(){
var tmpStr = this;
var iLen = arguments.length;
for(var i=0;i<iLen;i++){
tmpStr = tmpStr.replace(new RegExp("//{" + i + "//}", "g"), arguments[i]);
}
return tmpStr;
}
function setPagenum(){//整理Cookie
pagenum = Cookie.Get("pagenum");
if(pagenum=="" || pagenum<1){
pagenum=1;
}
}
setPagenum();
//重新整理当前页码，如果页面小于1，则赋值为1，如果大于总页数，则等于总页数
coordinatePagenum(pagenum);
//根据当前要显示的页码取得当前面里第一条记录的号码
var pageBegin = (record*(pagenum-1)+1)|0;
//根据当前要显示的页码取得当前面里最后一条记录的号码
var pageEnd = record*pagenum;
function showhiddenRecord(pagenum){
number.innerHTML=pagenum;
if(pagenum<=1){
thePrePage.innerHTML="上一页";
}else{
thePrePage.innerHTML="<a href=/"javascript:prePage()/">上一页</a>";
}
if(pagenum>=pageTotal){
theNextPage.innerHTML="下一页";
}else{
theNextPage.innerHTML="<a href=/"javascript:nextPage()/">下一页</a>";
}
document.getElementById('goto').value=pagenum;
//根据当前要显示的页码取得当前面里第一条记录的号码
pageBegin = (record*(pagenum-1)+1)|0;
//根据当前要显示的页码取得当前面里最后一条记录的号码
pageEnd = record*pagenum;
for(var i=1;i<=count;i++){
if(i>=pageBegin && i<=pageEnd){
mytable.rows[i].style.display="";
}else{
mytable.rows[i].style.display="none";
}
}
Cookie.Set("pagenum", pagenum);
}
//重新整理当前页码，如果页面小于1，则赋值为1，如果大于总页数，则等于总页数
function coordinatePagenum(num){
if(num<1){
num="1";
}else if(num>pageTotal){
num=pageTotal;
}
}
function prePage(){
pagenum--;
coordinatePagenum(pagenum);
showhiddenRecord(pagenum);
}
function nextPage(){
pagenum++;
coordinatePagenum(pagenum);
showhiddenRecord(pagenum);
}
function gotoPage(num){
coordinatePagenum(num);
pagenum=num;
showhiddenRecord(pagenum);
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad="showhiddenRecord(pagenum)">
<center>
共 23 页
当前第 <span id="number">1</span> 页
<span id="thePrePage"><a href="javascript:prePage()">上一页</a></span>
<span id="theNextPage"><a href="javascript:nextPage()">下一页</a></span>
快速转到第<select onChange="gotoPage(this.value)" name="goto">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
<option value=5>5</option>
<option value=6>6</option>
<option value=7>7</option>
<option value=8>8</option>
<option value=9>9</option>
<option value=10>10</option>
<option value=11>11</option>
<option value=12>12</option>
<option value=13>13</option>
<option value=14>14</option>
<option value=15>15</option>
<option value=16>16</option>
<option value=17>17</option>
<option value=18>18</option>
<option value=19>19</option>
<option value=20>20</option>
<option value=21>21</option>
<option value=22>22</option>
<option value=23>23</option>
</select>页
</center>
<br>
<br>
<TABLE width=712 border=1 align=center cellpadding=4 cellspacing=1 bordercolor="#999999" bgcolor=#999999 id="mytable">
<TR bgcolor=#ffffff><TD height="0"></TD>
</TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/0.jpg" width="700" height="827"><br><img src="shengbaoshu/1.jpg" width="700" height="567"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/2.jpg" width="700" height="600" align="middle"><br>
<img src="shengbaoshu/3.jpg" width="698" height="593" align="middle"></TD>
</TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/4.jpg" width="698" height="606" align="middle"><br><img src="shengbaoshu/5.jpg" width="698" height="575" align="middle"></TD>
</TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/6.jpg" width="698" height="565" align="middle"><br><img src="shengbaoshu/7.jpg" width="698" height="590" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/8.jpg" width="698" height="598" align="middle"><br><img src="shengbaoshu/9.jpg" width="698" height="572" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/10.jpg" width="698" height="597" align="middle"><br><img src="shengbaoshu/11.jpg" width="698" height="581" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/12.jpg" width="698" height="562" align="middle"><br><img src="shengbaoshu/13.jpg" width="698" height="601" align="middle"></TD>
</TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/14.jpg" width="697" height="581" align="middle"><br>
<img src="shengbaoshu/15.jpg" width="698" height="576" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/16.jpg" width="698" height="585" align="middle"><br><img src="shengbaoshu/17.jpg" width="698" height="575" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/18.jpg" width="698" height="603" align="middle"><br><img src="shengbaoshu/19.jpg" width="698" height="534" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/20.jpg" width="698" height="592" align="middle"><br><img src="shengbaoshu/21.jpg" width="698" height="581" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/22.jpg" width="698" height="581" align="middle"><br><img src="shengbaoshu/23.jpg" width="698" height="582" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/24.jpg" width="674" height="454" align="middle"><br>
<img src="shengbaoshu/25.jpg" width="698" height="596" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/26.jpg" width="697" height="512" align="middle"><br>
<img src="shengbaoshu/27.jpg" width="697" height="443" align="middle"></TD>
</TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/28.jpg" width="698" height="567" align="middle"><br><img src="shengbaoshu/29.jpg" width="697" height="402" align="middle"></TD>
</TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/30.jpg" width="697" height="406" align="middle"><br>
<img src="shengbaoshu/31.jpg" width="698" height="503" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/32.jpg" width="698" height="598" align="middle"><br><img src="shengbaoshu/33.jpg" width="698" height="595" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/34.jpg" width="698" height="596" align="middle"><br><img src="shengbaoshu/35.jpg" width="698" height="616" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/36.jpg" width="698" height="613" align="middle"><br><img src="shengbaoshu/37.jpg" width="698" height="642" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/38.jpg" width="698" height="594" align="middle"><br><img src="shengbaoshu/39.jpg" width="698" height="578" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/40.jpg" width="698" height="588" align="middle"><br><img src="shengbaoshu/41.jpg" width="698" height="561" align="middle"></TD></TR>
<TR bgcolor=#ffffff><TD><img src="shengbaoshu/42.jpg" width="697" height="594" align="middle"><br>
<img src="shengbaoshu/43.jpg" width="698" height="660" align="middle"></TD>
</TR>
<TR bgcolor=#ffffff><TD valign="top"><img src="shengbaoshu/44.jpg" width="699" height="155"></TD>
</TR>
</TABLE>
</BODY>
</HTML>
这些东西如果想用，自己该代码！我们这个由于内容太多，所以就全粘上了！
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
