您的位置:首页 > 其它

网页设计常用的一些技巧

2007-10-04 09:34 471 查看
大家可以去我的资源-最新最全的免费资源下载

1.加入收藏,设为首页:

<a href="javascript:window.external.AddFavorite('http://www.asp99.com','Asp99源码中心')">加入收藏</a>

<a

href="#"

onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http:

//www.asp99.com');">设为首页</a>

2.2秒后关闭当前页:

<script language="JavaScript">

<!--

  setTimeout('window.close();',2000);

-->

</script>

3.IE地址栏前换成自己的图标:

在首页<head></head>之间加上如下代码

<link rel="Shortcut Icon" href="favicon.ico">

4.在收藏夹中显示出你的图标:

在首页<head></head>之间加上如下代码

<link rel="Bookmark" href="favicon.ico">

5.改变滚动条颜色:

在首页<head></head>之间加上如下代码

<style>

body{

scrollbar-face-color:147faf; scrollbar-shadow-color:147faf;

scrollbar-highlight-color:147faf; scrollbar-3dlight-color:ffffff;

scrollbar-darkshadow-color:ffffff; scrollbar-track-color:ffffff;

scrollbar-arrow-color:ffffff;}

</style>

scrollbar-face-color表示滚动条面的颜色

scrollbar-shadow-color表示滚动条右斜面的颜色

scrollbar-highlight-color表示滚动条左斜面的颜色

scrollbar-3dlight-color表示滚动条上边和左边边沿的颜色

scrollbar-darkshadow-color表示滚动下边和右边边沿的颜色

scrollbar-track-color表示滚动条底板的颜色

scrollbar-arrow-color表示滚动条两端箭头的颜色

6.鼠标移到单元格颜色改变:

<table width=200><tr>

<td

bgcolor="#738278" style="cursor:hand"

onMouseOver="this.style.backgroundColor='red'"

onMouseOut="this.style.background='#738278'">移過來</td><

/tr></table>

7.申请按钮的等待:

把如下代码加入<body>区域中

<FORM action=register.cgi

method=post name=agree><CENTER><INPUT name=agreeb

type=submit value="请认真查看<服务条款和声明> (15秒后继续) "><INPUT

onclick=history.back(-1) type=reset value=" 我 不 同 意

"></CENTER></form>

<SCRIPT language=javascript>

<!--

var secs = 15;

document.agree.agreeb.disabled=true;

for(i=1;i<=secs;i++) {

window.setTimeout("update(" + i + ")", i * 1000);

}

function update(num) {

if(num == secs) {

document.agree.agreeb.value =" 我 同 意 ";

document.agree.agreeb.disabled=false;

}

else {

printnr = secs-num;

document.agree.agreeb.value = "请认真查看<服务条款和声明> (" + printnr +" 秒后继续)";

}

}

//-->

</SCRIPT>

8.实现连续滚动:

<body>

<div id=demo style=overflow:hidden;height:60px>

<div id=demo1>

111111111111111<br>

222222222222222<br>

333333333333333<br>

444444444444444<br>

555555555555555

</div>

<div id=demo2></div>

<script>

var t=demo.scrollTop

demo2.innerText=demo1.innerText

function qswhMarquee(){

if(demo2.offsetTop-demo.scrollTop<=0)

demo.scrollTop-=demo1.offsetHeight

else

demo.scrollTop++

}

setInterval(qswhMarquee,30)

</script>

</body>

9.无提示自动关闭窗口:

脚本说明:

第一步:把如下代码加入<body>区域中

<OBJECT

id=closes type="application/x-oleobject"

classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"><param

name="Command" value="Close"></object>

第二步:把<body>中的内容改为:

<body onload="setTimeout('closes.Click()',20000)">

10.弹出确认删除:

<1>vbscript:

<script language="vbscript">

sub check()

dim a

a=MsgBox("确定要删除吗?",vbOKCancel)

if a=1 then

window.event.returnvalue=true

else

window.event.returnvalue=false

end if

end sub

</script>

<a href="http://www.asp99.com/" onClick="check()">删除</a>

<2>javascript:

<script language="JavaScript1.2">

<!--

function confirmdel(id){

if (confirm("真的要删除吗?"))

window.location.href="/admin_deladmin.asp?id="+id

}

-->

</script>

<a href='javascript:confirmdel("<%=rs("id")%>")'>删除</a>

11.防止点击空链接回到页首端:

把代码“javascript:void(null)”代替原来的“#”标记.

12.window.open的使用语法:

window.open('URL','Name','Features')

name可为空

如:

<a href="javascript:window.open('http://www.asp99.com','','width=400,height=400')">弹出窗口</a>

其中http://www.asp99.com 是你要打开的网页地址。可以使用相对或者是绝对地址,而width=400,height=400 是定义弹出窗口的宽度和高度都是400,其他的几个参数:

toolbar(yes|no): 是否出现浏览器工具栏,在已经设置窗口大小的情况下,默认为no,即不出现!

下同:

location:地址栏

status:状态栏

menubar:菜单条

scrollbars:滚动条

resizable:表示是否出现窗口大小的调整手柄!

结合flash as里边的getURL就是

getURL("javascript:window.open('http://www.asp99.com','','width=400,height=400')")

13.版权声明的写法正确的格式:

©1995-2004 Macromedia, Inc. All rights reserved.

©2004 Microsoft Corporation. All rights reserved.

Copyright © 2004 Adobe Systems Incorporated. All rights reserved.

©1995-2004 Eric A. and Kathryn S. Meyer. All Rights Reserved.

14.内容提交等待:

把如下代码加入<body>区域中

<script language=javascript>

<!--

function showSending() {

sending.style.visibility="visible";

}

-->

</script>

然后调整下面代码的参数使显示提示显示在你想要的位置:

<div id="sending" style="position:absolute; z-index:10; width: 400; visibility:hidden">

<table width=400 height=80 border=0 cellspacing=2 cellpadding=0 bgcolor="#8FA8E9">

<tr>

<td bgcolor=#eeeeee align=center>内容正在发送, 请稍候...</td>

</tr>

</table>

</div>

最后再提交按钮加入 onClick="showSending()">,如:

<input type='submit' name='ACTION' value='发送' onClick="showSending()">

15.实现 iframe 的自适应高度,参考如下代码:

<iframe id="newslist"

name="newslist" width="540" src="/iframenews.htm" marginwidth="1"

marginheight="1" border="0" frameborder="0" target="_self"

style="height:expression(eval(newslist.document.body.scrollHeight))"

>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: