21.选择、复制和清除按钮
代码如下：
<textarea cols="100" rows="20" id="demo" style="height:120px"><button onClick="demo.select();">全选</button><button onClick="document.execCommand('copy')">复制</button><button onClick="demo.select();document.execCommand('copy')">全选并复制1</button><button onClick="demo.createTextRange().execCommand('copy')">全选并复制2</button><button onClick="window.clipboardData.setData('Text',demo.value)">全选并复制3</button><button onClick="demo.value=''">重置</button>
</textarea>
<button onClick="demo.select();">全选</button>
<button onClick="document.execCommand('copy')">复制</button>
<button onClick="demo.select();document.execCommand('copy')">全选并复制1</button>
<button onClick="demo.createTextRange().execCommand('copy')">全选并复制2</button>
<button onClick="window.clipboardData.setData('Text',demo.value)">全选并复制3</button>
<button onClick="demo.value=''">清空</button>
22.TEXTAREA自适应文字行数
代码如下：
<textarea rows=1 name=s1 cols=27 onpropertychange="this.style.posHeight=this.scrollHeight">
</textarea>
在下面输入多行测试：
23. 页面载入和退出过渡效果
将以下代码行复制到<head></head>之间
代码说明
duration表示特效的持续时间，以秒为单位。transition表示使用哪种特效，取值为1~23。
| 0 矩形缩小 1 矩形扩大 2 圆形缩小 3 圆形扩大 4 下到上刷新 5 上到下刷新 6 左到右刷新 7 右到左刷新 8 竖百叶窗 9 横百叶窗 10 错位横百叶窗 11 错位竖百叶窗 12 点扩散 |
13 左右到中间刷新 14 中间到左右刷新 15 中间到上下 16 上下到中间 17 右下到左上 18 右上到左下 19 左上到右下 20 左下到右上 21 横条 22 竖条 23 以上22种随机选择一种 |
24.简单的页面加密
<script LANGUAGE="javascript">
<!--
function loopy(){
var sWord ="";
while(sWord!="login"){sWord=prompt("请输入你的登陆密码");}
alert("登陆成功！");
}
loopy()
//-->
</script>
例：示例网页
25.不要滚动条
让竖条没有:
<body style="overflow:scroll;overflow-y:hidden">
</body>
让横条没有:
<body style="overflow:scroll;overflow-x:hidden">
</body>
两个都去掉:
<body scroll="no">
</body>
26.最小化、最大化窗口
在文件头加入以下代码：
<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Minimize"></object>
<object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Maximize"></object>
在文件中加入以下代码：
<input type=button value=最小化 onclick=hh1.Click()>
<input type=button value=最大化 onclick=hh2.Click()>
27.网页代码中META标签里的代码的含义
<META>是放于<HEAD>与</HEAD>之间的标记.在网页中最常见的几种：
<meta name="Keywords" content="图片, 新闻, 音乐, 软件">
该网页的关键字，作用于搜索引擎的登录，事实上它在现在的网站中并没什么用。
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
设定这是 HTML 文件及其编码语系，简体中文网页使用charset=gb2312，繁体中文使用charset=big5，或者不设编码也可，纯英文网页建议使用 iso-8859-1。
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
这只表示该网页由什么编辑器写的。
<meta http-equiv="refresh" content="10; url=具体网址">
能于预定秒数内自动转到指定网址。原代码中10表示10秒。
28.给图片加上鼠标经过会发生抖动的效果
将以下代码放在头部：
<SCRIPT language=javascript1.2>
<!--
var rector=2
var stopit=0
var a=1
var count=0
function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}
function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1||count==100)
return
count++
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector
}
else{
shake.style.left=parseInt(shake.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}
function stoprattle(which){
stopit=1
count=0
which.style.left=0
which.style.top=0
}
//-->
</SCRIPT>
<style>.shakeimage {POSITION: relative}
</style>
将以下代码放在网页中：
<img src="图片的路径" onmouseout=stoprattle(this) onmouseover=init(this);rattleimage() class=shakeimage>
29.用CSS设计邮票一样的效果
<input type=button value=我象不象邮票？ style="height:80px;border:2px dashed #cccccc">
30.用CSS设计的隔行背景换色列表
(1)下列代码放在头部
<style type="text/css">
<!--
.linecolor{
border:1px solid #000;
color:#333;
font:12px;
}
.linecolor li{
padding-left:5px;background-color:expression(this.sourceIndex%2 ? '#efefef':'#fefefe');
}
-->
</style>
(2)<body>改为<body class="linecolor">
(3)网页内容代码如下：
<ol>
<b>《静夜思》</b>
<li>窗前明月光</li>
<li>疑是地上霜</li>
<li>举头望明月</li>
<li>低头思故乡</li>
</ol>
<ul>
<li>项目列表背景隔行换色的效果演示，</li>
<li>注意观察效果。</li>
<li>本例应用于全页，</li>
<li>应用范围加了个边框。</li>
</ul>