博客 (683)

一般来说，我们在写博客或做网站时都需要对插图做一些效果，比如增加阴影、图片圆角、倒映等等。这些效果一般可以用3个方法实现，一是用PS实现对图片进行修改，二是使用CSS，三是使用JavaScript。使用PS会破坏原图，而且要花费一定的时间。Netzgesta上有很多实现图片特效的JavaScript提供下载，很多效果都是相当漂亮的。

1、水倒映

这个js将为图片添加水倒映的特效，时下web2.0站点很喜欢这种效果。

如果你喜欢在线生成水倒映效果，可以参考这里。

js下载链接

2、圆角+阴影

或许你记得用RoundPic能在线生成圆角图片，事实上用这个js也可以实现效果。

js下载链接

3、高光圆角阴影

这个效果可以用来做按钮。是我最喜欢的特效之一。

js下载链接

4、斜光阴影效果

和上面的效果看起来非常相似，但也有不同的地方。

js下载链接

5、相框效果

如果你在做图片博客，可以你会喜欢这个js，使用后博客文章内的图片都有相框的效果。

js下载链接

6、黑色相框

不喜欢白色没有立体感的相框，那试试这个立体感充足的js效果吧。

js下载链接

7、放大镜

一个很有趣的js，实现放大镜效果。记得在去年Google开发者日的时候，某个主讲人也有说到在GMaps里实现放大镜的有趣效果。具体效果点击这里。

js下载链接

8、菲林效果

如果你在写一个电影博客，这个效果或许会让你喜欢。

js下载链接

9、花边效果

很简单的图片花边效果。

js下载链接

10、翻页效果

翻页效果是很常见的，Google一下你会发现有很多相关的教程，如果你不想花时间去学，直接下载这个js吧。

js下载链接

安装使用方法：

将下载的压缩包解压之后上传到网站空间，然后在需要显示效果的head里添加代码，比如高光阴影效果Glossy，添加的代码是：

<script type="text/javascript" src="glossy.js"></script> 

对于Wordpress，可以在header.php里添加。如果只要求文章页里出现效果，也可以考虑在single.php里添加。

然后，在想要显示特效的图片的<img>标记里添加：

class="glossy"

这样效果就出现了。

其它效果添加方法类似。

via BlogOhblog。

下载地址（eMule）:http://www.verycd.com/topics/69331/

中文名称：张孝祥IT课堂－JavaScript教学视频录像
地区：大陆
语言：普通话
简介：

张孝祥IT课堂－JavaScript教学视频录像

隆重发行

经过张孝祥老师三个月的潜心制作，《张孝祥IT课堂－JavaScript教学视频录像》终于面世了。新版的《张孝祥IT课堂－JavaScript教学视频录像》 秉承《张孝祥IT课堂－Java教学视频录像（高级篇）》身临其境的手把手教学风格，并且采用了高效数字编码算法和全新的多媒体播放器，图象更清晰、操作更方便，最直观地让学员身临其境地学习和感受编程的乐趣，更能体会张孝祥老师授课的震撼力和穿透力。

光盘的内容:本教程结合大量应用实例，详细地讲解了HTML语言、CSS、JavaScript、DOM对象模型编程、正则表达式，并介绍了网页脚本编程的其它相关技术和知识，例如，VBScript、NetScape控件、ActiveX控件、Java Applet小程序等。本书力求在不减少知识信息量的情况下，能够把书写薄，同时又能把问题说透，让读者能够迅速上手，尽最大可能地扩展读者的知识面，启发读者自我思考和学习的能力，让读者感受到技术学习所带来的快乐。本教程主要面向网站开发人员，也适于普通前端网页设计人员阅读。考虑到适应实际工作中的不仅仅需要编程语言本身，还要有一些计算机相关的周边知识的特点，所以，本教程从原理和细节上着手,让读者对一些专业术语透彻理解，尽最大程度扩展读者的知识面。本教程强调用最短的时间和最浅显易懂的例子说明问题，启发读者思考和自我解决问题的能力，以知识够用为原则，重视学会的本质，能让读者做一些基本的应用开发，碰到新问题时，能自己查阅资料独立解决，就叫学会，没有任何人能掌握一门学科的每个细节。

JavaScript教学视频录像总时间为40小时左右，为了让用户了解到更为精确的信息，本站以后不再使用光盘的张数来作为产品的度量单位，而改用视频教程的时间来度量。

说明：
javascript教程进行了部分加密，加密部分在未注册的计算机上不能播放，用户需要向我们索取注册码后对计算机进行注册，每台计算机的注册码都不一样。 如果计算机的CPU识别信息、硬盘序列号、硬盘分区、内存等这四个内容之一发生了变化，就可能导致软件认为是在另外一台计算机上运行，为此，我们可以为每个用户从购买之日算起的每年都提供三个注册码。 我们每年为用户提供三个注册码，主要是为了方便用户硬件升级或更改后能继续使用，希望大家不要随意替他人索取注册码，以免影响自己使用。

由于加密后的视频具有对计算机资源要求高、启动时间长等缺点，所以，本套视频教程采用了部分视频片段加密、部分视频片段不加密的混合方式发行。

如何理解JavaScript、Java、Jsp、J2ee之间的关系与区别

很多初学习者对JavaScript、Java、Jsp、J2ee之间的关系与区别总是感到很困惑，为了帮助大家快速理解几者之间的关系，我们进行了如下解释说明：

1. JavaScript用于编写嵌入在网页文档中的程序,它由浏览器负责解释和执行，可以在网页上产生动态的显示效果和实现与用户交互的功能，譬如，让一串文字跟着鼠标移动，让一个图标在网页漂浮移动，验证用户输入的信用卡号的格式正确与否，等等特效网页功能。

2. Java则是一种基础性的语言，学习jsp,j2ee都要有java的基础。无论你是想成为诗人，还是小说家，还是散文家，甚至就是当记者，你都要学习语文吧，Java就相当于语文、Jsp、J2ee则相当于小说、散文等。学好了语文，你能否就会有一份好的职业呢？不见得吧，但至少机会要多多了，语文学得越好，就更容易成为小说家，或是记者等等了。要想成为记者、散文家等等，没有语文是怎么都不行的。

3. jsp用于让www服务器产生出内容可以变化的网页文档和对用户提交的表单数据进行处理，例如，显示留言内容，留言内容总是在增加的，所以，传递给用户浏览器的网页文件内容是需要改变的，这就是jsp来实现的。将用户留言插入到数据库中，也是jsp来实现的。

4. j2ee用于开发大型的商业系统，例如，你在各个银行之间的取款，存款，银行之间要互通有无，执行存取款的记录操作，还要进行安全性检查，不能谁都可以来查帐，还要考虑网络断线等问题。使用j2ee，你就不用编写这些底层的细节程序代码了，而将精力集中到应用的业务流程设计上。

<INPUT onfocus="oRng=this.createTextRange();oRng.collapse(true);oRng.moveStart('character',3);oRng.select()" value=abcdefg type=text name=text1>

当焦点移至文本框时光标定位在位置3。

如果要直接定位在文本末尾，把上面的数字 3 改为 this.value.length 即可。

代码：

 

效果：

代码：

 

说明：

该代码兼容性非常差，在XHTML文档中或在非IE浏览下浏览均不能达到预期效果，原因可能是它们的 select 元素的 z-index 太高，并且 css 定位方式不同，部署于应用还需改进代码。

方法：
    write,向HTML动态写入内容
    writeln，多加一个换行
    open,与window.open类似，不建议用
    close,当向新打开的文档对象中写完所有的内容后，一定要调用该方法关闭文档流
    clear,用于清除文档中的所有内容，建议用document.write("");document.close();这两条语句来实现同样的功能。
    getElementById,返回id的对象
    getElementByName,返回name的对象组（注意是数组）
    getElementByTagName,返回标签名的对象组
    createElement,产生一个代表某个HTML元素的对象，随后再其它方法将这个对象插入到文档中。
    createStyleSheet,为当前HTML产生一个样式表或增加一条样式规则。
属性：
    document.cookie

方法：
   alert,对话框，OK按钮
   confirm,对话框，OK和Cancel按钮
   prompt,对话框，可输入
   close，关闭当前浏览器窗口
   navigate，在当前窗口中导航到指定的URL资源
   setInterval，设置每隔一定时间调用指定程序代码，毫秒，setInterval("Func()",5000)
   setTimeout,设置经过一定时间后执行一次指定程序代码，毫秒，setTimeout("Func()",5000)
   clearInterval,
   clearTimeout,
   moveTo，将浏览器窗口移动到屏幕上的某个位置
   resizeTo,改变浏览器窗口的大小
   open，打开一个新窗口 window.open("abc.html","_blank","top=0,left=0,width=100,height=200,toolbar=no");
   showModalDialog产生一个模态对话框
   showModelessDialog产生一个非模态对话框窗口
属性：
    closed
    opener
    defaultstatus
    status
    screenTop
    screenLeft
事件：
    onload,onunload,onmouseover,...
对象属性：
    location对象：设置和返回当前网页的URL信息。
        载入一个新的网页：window.location.href="http://g.cn";
        刷新当前页：window.location.reload();
    event对象：获取和设置当前事件的有关信息。
        altKey属性，用于检测事件发生时Alt键是否被按下
        ctrlKey。。。
        shiftKey...
        screenX,screenY设置和返回鼠标相对屏幕顶点的x,y坐标
        offsetX,offsetY设置和返回鼠标相对事件源顶点的x,y坐标
        x,y 设置和返回鼠标相对事件源的父元素顶点x,y坐标
        returnValue设置和返回事件的返回值，一般情况下设置为false
        cancelBubble设置和返回当前事件是否继续向下传递
        srcElement设置和返回事件源对象
        keyCode设置和返回键盘按下或弹起时的键的unicode码
        button检索鼠标动作使用的是哪个按键，1左鍵，2右键，3左右同时
function window_onkeypress()
{
//    alert(window.event.keyCode);
    if(window.event.keyCode==27)
    {
        window.close();
    }
}

－－－－－－－－－－－－－－－－－－－－
常量：
整型，实型，布尔值，字符串型，null，undefined

变量：var
－－－－－－－－－－－－－－－－－－－－
除法运算：9/4 = 2.25 （而不是2）

－－－－－－－－－－－－－－－－－－－－
系统函数：
1，encodeURI URL编码
   var urlStr=encodeURI("http://www.abc.com/?country=吴&name=z x");
   结果：http://www.abc.com/?country=%E5%90%B4&name=z%20x
2，decodeURI URL解码
3，parseInt 将字符串按指定进制转换成一个整数,参数二表示进制
   parseInt("32",10) 结果：32
   parseInt("3c2",10) 结果：3
   parseInt("c32",10) 结果：NaN
   parseInt("0x18",10) 结果：0
   parseInt("12",16) 结果18
4，parseFloat 将字符串转成小数
   parseFloat("2.5") 结果：2.5
   parseFloat("2.c5") 结果：2
   parseFloat("c2.5") 结果：NaN
5，isNaN 用于检测parseInt和parseFloat返回是否为NaN
   返回true/false
6，escape 编码
   非ASCII替换为%xx
7，unescape 解码
8，eval 将字符串作为JS表达式执行，例
   for(var i=0;i<3;i++) eval("var a"+i+"="+i);
   相当于：
   var a0=0; var a1=1; var a2=2;
－－－－－－－－－－－－－－－－－－－－
对象
1，Object
2，String
   方法：
   indexOf,
   lastIndexOf,
   match,使用正则表达式模式对字符串执行搜索，返回包含该搜索结果的数组
   replace,
   search,使用正则表达式搜索，第一个匹配的字符的位置
   slice,截字符串：参数一，开始位置，参数二，结束位置（不指定或为-1时表示末位置）
   split,返回一个字符串按照某种分隔标志符拆分为若干子字符串时所产生的字符串数组，分隔符可以是多个字符或一个正则表达式，它不作为任何数组元素的一部分返回。
   substr,截字符串：参数一，开始位置，参数二，长度
   toLowerCase,
   toUpperCase,
3，Math（不能用new创建）
   方法：
   abs,绝对值
   sin,cos,正余弦
   asin,acos,反正余弦
   random,返回介于0~1之间的伪随机数
   例：var num = Math.randow();
4，Date
    var currentTime=new Date();
    //var currentTime=new Date(2002,3,4);
    var strDate=currentTime.getYear()+"年";
    strDate+=currentTime.getMonth()+"月";
    strDate+=currentTime.getDate()+"日";
    strDate+=currentTime.getHours()+":";
    strDate+=currentTime.getMinutes()+":";
    strDate+=currentTime.getSeconds()+" ";
    strDate+=currentTime.getMilliseconds();
    alert(strDate);
   结果：2008年1月19日15:27:10 518
－－－－－－－－－－－－－－－－－－－－－－
数组
1，
    var arr=["abc",123,'abc',,3.4];
    for(var i=0;i<arr.length;i++)
    {
        alert(arr[i]);
    }
2，用对象的方式实现数组
    function MyArray(){this.length=arguments.length;for(var i=0;....
3，Array对象
    var arr=new Array(2.4,"abc",2);
    arr.sort(); //排序
    alert的结果为 2 2,4 abc
－－－－－－－－－－－－－－－－－－－－－－－

<div style="width: 120px; height: 50px; border: 1px solid blue; text-overflow: ellipsis; overflow: hidden;">
<nobr>就是比如有一行文字，很长，表格内一行显示不下.</nobr>
</div>

p:first-line   段落中的第一行文本

p:first-lette   段落中的第一个字母

 

效果：

 

中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国中华人民共和国

abcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefgabcdefg