FDS's Blog » HTML

document.body.scrollTop的返回值总是零的处理方法

fangds — Wed, 29 Apr 2009 02:56:10 +0000

为什么document.body.scrollTop的值总是零呢？原来是头部声明的问题，也是标准的问题。

原来在HTML文件头部声明了这样一句：

改成这样就好了：

var scrollPos;
if (typeof window.pageYOffset != ‘undefined’) {
   scrollPos = window.pageYOffset;
}
else if (typeof document.compatMode != ‘undefined’ &&
     document.compatMode != ‘BackCompat’) {
   scrollPos = document.documentElement.scrollTop;
}
else if (typeof document.body != ‘undefined’) {
   scrollPos = document.body.scrollTop;
}
alert(scrollPos);

一切OK.

A链接的样式属性全解

fangds — Tue, 21 Apr 2009 02:14:07 +0000

1、不同状态下的解释
link:连接平常的状态
active:连接被按下的时候
visited:连接被访问过之后
hover:鼠标放到连接上的时候

2、a:hover和a:visited书写顺序的重要性
今天在用a:hover属性的时候发现一个奇怪的问题，同一个页面里面有些链接的a:hover效果不能正常表现出来。链接的代码是一样，没有使用其它样式固定，搞的我莫名其妙。还以为是某个标签没有关闭，但是页面比较长，检查起来又嫌累，但是想来想去找不到其它原因，索性把浏览器一关，做别的事情去了。
重新打开这个页面的时候，突然发现那个链接的a:hover效果又出来了。我想了一下，点了那个链接，然后回过头再点，果然又没了。连忙检查css文档，发现a:hover属性写在了visited之前，改写到之后，重试，ok！
以前看书的时候注意到css中关于链接表现的书写有提示说各属性顺序不能颠倒，一直没有注意，写的时候通常都很随意。现在看来不能这个顺序还是很重要的。
css中关于超链接的四个属性一般正常顺序为：link，visited，hover，active

让火狐和IE里面的flash背景都透明透明

fangds — Thu, 16 Apr 2009 07:41:47 +0000

在IE浏览器中，我们只要在FLASH的属性里面加一个就可以让FLASH的背景透明了，但是火狐里面似乎不起作用。查找了不少时间，发现问题所在。

下面的插入FLASH的代码可以解决这个问题，注册红色的部分，再看看你的，是不是少了后面的。

            wmode=”transparent”>

JS弹出菜单纵向/横向效果

FDS — Tue, 24 Mar 2009 09:05:49 +0000

JS弹出菜单效果，包括纵向和横向的。以下是实现方法。

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
http://www.w3.org/1999/xhtml“>

真空镀铝机

在火狐里面强制换行字符

fangds — Mon, 23 Mar 2009 09:36:47 +0000

火狐也不知道为什么，自己功能上，样式上面，都无法让其强制换行，这里用JS来实现火狐里面强制换行的方法。

<!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=utf-8" /> <title>firefox-break-word</title> <style type="text/css"> <![CDATA[/*> </style> </head> <body> <div id="break"> If there were less sympathy in the world, there would be less trouble in the world. ( O. Wilde ) </div> <script> function toBreakWord(intLen){ var obj=document.getElementById("ff"); var strContent=obj.innerHTML; var strTemp=""; while(strContent.length>intLen){ strTemp+=strContent.substr(0,intLen)+"<br>"; strContent=strContent.substr(intLen,strContent.length); } strTemp+="<br>"+strContent; obj.innerHTML=strTemp; } if(document.getElementById && !document.all) toBreakWord(37) </script> </body> </html>

提示：你可以先修改部分代码再运行。

html中的input、submit和button的区别

fangds — Wed, 17 Dec 2008 07:33:40 +0000

type=button 就单纯是按钮功能
type=submit 是发送表单

但是对于从事WEB UI的人应该要注意到，使用submit来提高页面易用性：
使用submit后，页面支持键盘enter键操作，而很多WEB软件设计师，可能没有注意到submit统一.

用button后往往页面不支持enter键了。所以需要支持enter键，必须要设置个submit，默认enter键对页面第一个submit进行操作。

执行完onClick，转到action。可以自动提交不需要onClick。所以说onclick这里可以不要。

执行完onClick，跳转文件在 js文件里控制。提交需要onClick。

比如：

1，onclick=”form1.action=’a.jsp’;form1.submit();” 这样就实现了submit的功能了。

2，

3，

用JavaScript验证表单中的email地址是否合法完整实例

FDS — Thu, 20 Nov 2008 02:09:11 +0000

在设计表单是，经常要遇到要求输入EMAIL的。这里就用一个完整实例来说明用JavaScript验证email地址的完美方法。

以下是代码部分。

<html> <head> <title>验证email地址是否合法</title> <script language="JavaScript">  function char_test(chr) //字符检测函数 { var i; var smallch="abcdefghijklmnopqrstuvwxyz"; var bigch="ABCDEFGHIJKLMNOPQRSTUVWXYZ"; for(i=0;i<26;i++) if(chr==smallch.charAt(i) || chr==bigch.charAt(i)) return(1); return(0); } function spchar_test(chr) //数字和特殊字符检测函数 { var i; var spch="_-.0123456789"; for (i=0;i<13;i++) if(chr==spch.charAt(i)) return(1); return(0); } function email_test(str) { var i,flag=0; var at_symbol=0; //“@”检测的位置 var dot_symbol=0; //“.”检测的位置 if(char_test(str.charAt(0))==0 ) return (1); //首字符必须用字母 for (i=1;i<str.length;i++) if(str.charAt(i)=='@') { at_symbol=i; break; } //检测“@”的位置 if(at_symbol==str.length-1 || at_symbol==0) return(2); //没有邮件服务器域名 if(at_symbol<3) return(3); //帐号少于三个字符 if(at_symbol>19 ) return(4); //帐号多于十九个字符 for(i=1;i<at_symbol;i++) if(char_test(str.charAt(i))==0 && spchar_test(str.charAt(i))==0) return (5); for(i=at_symbol+1;i<str.length;i++) if(char_test(str.charAt(i))==0 && spchar_test(str.charAt(i))==0) return (5); //不能用其它的特殊字符 for(i=at_symbol+1;i<str.length;i++) if(str.charAt(i)=='.') dot_symbol=i; for(i=at_symbol+1;i<str.length;i++) if(dot_symbol==0 || dot_symbol==str.length-1) //简单的检测有没有“.”，以确定服务器名是否合法 return (6); return (0); //邮件名合法 } </script> </head> <body> <form method="POST" name="emal" onSubmit="return mail_process(email_add.value)"> <p>请输入您的E-mail地址： <input type="text" name="email_add" size="20" > <input type="submit" value="确定" name="B1"></p> </form> </body> </html>

提示：你可以先修改部分代码再运行。

几招设定网页边距的小技巧

FDS — Tue, 18 Nov 2008 06:12:38 +0000

在默认情况下设计网页的时候，页面和浏览器都有一点距离，那如何让内容部分紧贴着呢？看看如下方法吧。

在页面的风格设定内加入下面的定义

又或者在BODY中直接加入

原始的方法为
   [只适合IE]
   [只适合NC]
推荐写法为

关闭表单输入是的输入法

FDS — Wed, 29 Oct 2008 09:57:48 +0000

在填写表单时，有时候输入数据时不需要使用其他输入法模式，我们可以关闭输入法状态，看以下的例子。

<body> <input style="ime-mode:disabled">在这里切换输入试试看。 </body>

提示：你可以先修改部分代码再运行。

制作自己网站地址栏的图标。

FDS — Tue, 28 Oct 2008 10:00:51 +0000

如何制作favicon.ico文件？
你可以先在FW中做一个图片，属于你自己站点一个小图标。然后在ACD see将文件属性改为favicon.ico，并将你做的favicon.ICO文件传到你的服务器目录中，把
代码添加的你的网页HEAD之间就可以，当别人登陆你的站点时，地址栏出现的就是你自定义的图标了。很酷哦。

如何防止网页的复制和剪贴操作？

FDS — Mon, 27 Oct 2008 05:20:19 +0000

有时候，为了防止别人复制自己的网页内容，我们需要防止网页上的复制和剪贴操作，看看下面的例子。

<body oncopy="return false;" oncut="return false;"> 复制这些文字试试看效果。 </body>

提示：你可以先修改部分代码再运行。

如何禁止在网页中的粘贴动作？

FDS — Sun, 26 Oct 2008 12:57:50 +0000

如何禁止在网页中的粘贴动作？以下是一个例子，大家参考一下。

<body onpaste="return false"> <input value="">试着粘贴文字看看 </body>

提示：你可以先修改部分代码再运行。

用editplus批量修改文件的编码格式

FDS — Fri, 24 Oct 2008 07:26:20 +0000

可能有些朋友会遇见下载或拷贝回来的网站，在IIS中运行乱码，或在.NET开发环境中，打开JS乱码！
导致正常的JS总有莫名其秒的错误。其实这样大多是由于文件编码格式不对造成的！
今天从公司拷回来的系统，运行老报JS错，开始发现一个修改一个，但后来工作量太大，又懒得写一个程序，想在网上找找有没有现成的软件。
结果没怎么找到！后来发现Editplus有这个功能。

这样可以实现将已打开的文档更改编码格式。这里有个技术是，进入网站的根目录，然后使用搜索 .js .htc等，你需要修改的后缀名。
将所有查出来的文件选中，右键以Editplus打开。然后采用上述方式统一修改编码，很方便的！：）

来源：http://www.cnblogs.com/eflylab/archive/2008/08/03/1238550.html

如何禁止在网页选取来防止复制操作？

FDS — Fri, 24 Oct 2008 06:50:23 +0000

如何禁止在网页选取来防止复制操作？请看下面的实例。

<body onselectstart="return false"> 试着用鼠标选取文字看看。 </body>

提示：你可以先修改部分代码再运行。

如何彻底屏蔽网页鼠标右键菜单？

FDS — Thu, 23 Oct 2008 06:23:36 +0000

偶尔的时候，我会需要彻底屏蔽网页鼠标右键菜单，以下就是屏蔽网页鼠标右键菜单的方法。

<body oncontextmenu=return(false)> 用鼠标右键试试看效果呀。 </body>

提示：你可以先修改部分代码再运行。

HTML
标签的应用

FDS — Sun, 28 Sep 2008 02:23:29 +0000

定义和用法

fieldset 元素可将表单内的相关元素分组。

标签将表单内容的一部分打包，生成一组相关表单的字段。

标签没有必需的或唯一的属性。
当一组表单元素放到

标签内时，浏览器会以特殊方式来显示它们，它们可能有特殊的边界、3D 效果，或者甚至可创建一个子表单来处理这些元素。

在介绍一个和fieldset里面常使用的标签legend，它用来表示fieldset的标题。具体里请看以下示例。

<html> <body> <fieldset> <legend>看看这里是标题</legend> <form> <label>内容1：<input type="text" /></label> <label>内容2：<input type="text" /></label> </form> </fieldset> <p>如果输入表单周围没有边框，说明您的浏览器太老了。</p> </body> </html>

提示：你可以先修改部分代码再运行。

HTML
不支持 JavaScript 的浏览器将显示 noscript 元素中的文本。

提示：你可以先修改部分代码再运行。

HTML 标签的应用

FDS — Wed, 17 Sep 2008 01:59:24 +0000

base 元素可规定页面中所有链接的基准 URL，也就是说，定义如何打开，没有定义打开方式的链接。
通常情况下，浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。

使用标签可以改变这一点。浏览器随后将不再使用当前文档的 URL，而使用指定的基本 URL 来解析所有的相对 URL。这其中包括、、、