12 2012 档案

摘要:Web前端开发工程师是一个很新的职业,在国内乃至国际上真正开始受到重视的时间不超过5年。Web前端开发是从网页制作演变而来的,名称上有很明显的时代特征。在互联网的演化进程中,网页制作是Web 1.0时代的产物,那时网站的主要内容都是静态的,用户使用网站的行为也以浏览为主。 2005年以后,互联网进入Web 2.0时代,各种类似桌面软件的Web应用大量涌现,网站的前端由此发生了翻天覆地的变化。网页不再只是承载单一的文字和图片,各种富媒体让网页的内容更加生动,网页上软件化的交互形式为用户提供了更好的使用体验,这些都是基于前端技术实现的。 随着Web 2.0概念的普及和W3C组织的推广,网站... 阅读全文
posted @ 2012-12-31 11:31 piuba 阅读(489) 评论(0) 推荐(1) 编辑
摘要:1、jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动jquery图片特效制作仿腾讯QQ商城首页banner焦点图片轮播切换效果,带索引按钮控制和左右按钮控制图片切换。查看演示>> 下载地址2、jquery图片切换插件制作图片层叠缩放展示效果jquery图片插件制作图片等比列缩放层叠样式,图片叠加展示。点击层叠最上层的图片依次点击缩放图片层叠缩放切换。查看演示>> 下载地址3、jquery图像幻灯片制作大小图片切换滚动展示jquery图像幻灯片制作多张图片切换展示,小图片滚动切换大图显示,大图切换小图片滚动的jQuery图片幻灯片效果。查看演示>> 阅读全文
posted @ 2012-12-28 10:40 piuba 阅读(516) 评论(0) 推荐(0) 编辑
摘要:Fancybox的特点如下:可以支持图片、html文本、flash动画、iframe以及ajax的支持可以自定义播放器的CSS样式可以以组的形式进行播放如果将鼠标滚动插件(mouse wheel plugin)包含进来的话Fancybox还能支持鼠标滚轮滚动来翻阅图片Fancybox播放器支持投影,更有立体的感觉使用方法:1、引入jquery核心库和Fancybox插件库12<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.mi 阅读全文
posted @ 2012-12-26 17:40 piuba 阅读(441) 评论(0) 推荐(0) 编辑
摘要:继续上一篇文章使用jQuery.Validate进行客户端验证(高级篇-上),本文将继续介绍jQuery.Validate的高级应用——jQuery.Validate的AJAX验证及简单扩展。今天主要介绍的内容有:1、如何使用jQuery.Validate进行AJAX验证?2、默认jQuery.Validate在进行AJAX验证时返回必须是bool类型,如何返回一个对象包括错误消息及验证结果?3、在反复使用jQuery.Validate进行AJAX验证时,总是需要编写相关AJAX参数,可否进行进一步封装?第一点:如何使用jQuery.Validate进行AJAX验证?(具体见High-2.as 阅读全文
posted @ 2012-12-25 15:59 piuba 阅读(241) 评论(0) 推荐(0) 编辑
摘要:在上一篇使用jQuery.Validate进行客户端验证(中级篇-下)中我介绍了jQuery.Validate在日常使用的过程中会遇到哪些问题及解决办法,今天的高级篇则主要是对jQuery.Validate的一些高级应用进行介绍。本篇主要介绍为以下2点:1、扩展验证规则,jQuery.Validate只提供了一些基本的验证功能,并不能满足我们日常开发的需求,所以我们要为jQuery.Validate扩展验证规则。2、分组验证,在开发的时候有时会遇到的一个问题就是,不同按钮引发不同的验证。首先来介绍下第一点:扩展验证规则,在jQuery.Validate默认的验证规则无法满足我们的日常开发需求的 阅读全文
posted @ 2012-12-25 15:58 piuba 阅读(237) 评论(0) 推荐(0) 编辑
摘要:jquery.validate.js是jquery下的一个验证插件,功能比较强大,早就有所耳闻但是一只没有动手用过,现在在于能够研究一下了。这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录。 先贴一个国内某大公司的代码: 复制代码 代码如下: <script type="text/javascript"> function lang(key) { mylang = { 'ls_input_myb': '请输入您的账户', 'ls_myb_email': '漫游币账户为邮箱地址', &# 阅读全文
posted @ 2012-12-25 15:38 piuba 阅读(221) 评论(0) 推荐(0) 编辑
摘要:这款自动完成插件委实太强大了。demo演示了不下于其5种特性。自定义列表项的数据格式(格式化数据)支持本地、远程数据搜索拥有自定义事件完美融合thickbox完备的API和debug支持多选支持email自动完成点此下载(找不到其官方页面,我简要说明下其API,也是自己摸索的,不对的地方请指正。)$("#suggest1").autocomplete(cities);这是最简单的调用方式。接受唯一数据参数:cities(是个数组,详见demo文件夹下的localdata.js)。这是调用本地数据的例子。$("#singleBirdRemote").aut 阅读全文
posted @ 2012-12-24 15:50 piuba 阅读(325) 评论(0) 推荐(0) 编辑
摘要:1、autocomplete说到jquery的自动完成插件,就不得不说这个autocomplete插件,此插件极为强大…….2、Ajax AutoComplete3、Ajax Autocomplete Script using jQuery4、jQuery Autocomplete Plugin5、AutoSuggest jQuery Plugin严重推荐,样式相当不错。6、Tokenizing Autocomplete Text Entry也是一款非常不错的jquery自动完成插件。7、Facebook Style Autosuggest 阅读全文
posted @ 2012-12-24 15:49 piuba 阅读(208) 评论(0) 推荐(0) 编辑
摘要:v2.0终于露了尖尖角,文档还没来得及写,Demo先行:http://switchable.mrzhang.me/ ,源码:https://github.com/jsw0528/jQuery.Switchable新浪微博话题(主):http://s.weibo.com/weibo/jQuery.Switchable腾讯微博话题(从):http://t.qq.com/k/jQuery.Switchable无论是拍砖还是咨询,从上面两个地方会最快到达我这。2011-11-15 Update:Download: http://cloud.github.com/download ... itchabl 阅读全文
posted @ 2012-12-21 15:43 piuba 阅读(556) 评论(0) 推荐(0) 编辑
摘要:前不久在官方网站是看见这个插件,所以今天趁有空就看了一下,随便给大家共享一下。也许你早已知道了,如果是这样那请跳过,不要拍砖。这个Jquery插件的目的是替代JavaScript的标准函数alert(),confirm(),和 prompt()。这个插件有如下这些特点: 1:这个插件可以使你可以支持你自己的css制定。使你的网站看起来更专业。 2:允许你自定义对话框的标题。 3:在IE7中,可以使你避免使用JavaScript 的prompt()函数带来的页面重新加载。 4:这些方法都模拟了Windows的模式对话框。在你改变改变浏览器窗口大小时候,它能够自适应用户窗口的调整。 5:如果你引入 阅读全文
posted @ 2012-12-19 17:37 piuba 阅读(478) 评论(0) 推荐(0) 编辑
摘要:感谢 留痕 网友提交的bug,bug主要原因是我忽视了多个广告轮播和样式重名的问题;经简单的修改已经修复该问题。谢谢 留痕 网友。==============华丽的分割线================广告轮播,焦点图效果反反复复写了好几个插件,http://www.css88.com/?s=%E5%B9%BF%E5%91%8A%E8%BD%AE%E6%92%AD,http://www.css88.com/archives/2455这次这个插件主要解决了两个问题:1.当焦点图只有一张的时候不滚动;2.当鼠标经过右下角图片选择的控制点上加了延时,避免在用户不经意划过这些控制点的时候切换图片。具体 阅读全文
posted @ 2012-12-14 17:37 piuba 阅读(430) 评论(0) 推荐(0) 编辑
摘要:先看jQueryhover源代码:-----------------------------------------(function($){$.fn.hoverDelay=function(fnOver,fnOut,timeIn,timeOut){vartimeIn=timeIn||200,timeOut=timeOut||200,fnOut=fnOut||fnOver;varinTimer=[],outTimer=[];returnthis.each(function(i){$(this).mouseenter(function(){varthat=this;clearTimeout(ou 阅读全文
posted @ 2012-12-14 16:54 piuba 阅读(1371) 评论(0) 推荐(0) 编辑
摘要:在页面加载后执行任务$(document).ready()可以让jQuery响应网页加载事件,触发函数中的代码代码执行的时机选择我们已经知道,$(document).ready()是jQuery中响应JavaScript内置的onload事件并执行任务的一种典型方 式.当文档完全下载到浏览器中时,会触发window.onload事件,这意味着页面中的全部元素对JavaScript而言都是可访问的.而通 过$(document).ready()注册的事件处理程序,会在DOM完全就绪时就可以访问,这意味着所有元素对脚本来说是可访问的,但并不意味着关 联文件已下载完成简单的事件$(document) 阅读全文
posted @ 2012-12-14 14:23 piuba 阅读(236) 评论(0) 推荐(0) 编辑
摘要:关于Jquery的parent和parentsparent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。可以看出parent取的很明确,就是当前元素的父元素;parents则是当前元素的祖先元素。下面列出例子说明:<div id='div1'><div id='div2'><p></p></div><div id='div3' class='a' 阅读全文
posted @ 2012-12-13 11:32 piuba 阅读(285) 评论(0) 推荐(0) 编辑
摘要:点击此处下载插件,然后进行安装:1、把shared、Extensions、codehints三个文件夹复制到:WinXP:C:\Documents and Settings\Administrator\Application Data\Adobe\Dreamweaver CS5\zh_CN\Configurationwin7:C:\用户\Administrator\AppData\Roaming\Adobe\Dreamweaver CS5\zh_CN\Configuration下即可。注意:Administrator是你实际登录的用户的文件夹;AppData是隐藏文件夹。2.启动Dreamwe 阅读全文
posted @ 2012-12-13 10:14 piuba 阅读(178) 评论(0) 推荐(0) 编辑
摘要:margin 叠加是什么?就是当垂直外边距相遇时,它们将叠加,叠加的高度取较大的。下面按各种情况及附图来说明。当一个元素出现在另一个元素上面时,第一个元素的底边界与第二个元素的顶边界发生叠加,如图:元素的顶边界与前面元素的底边界发生叠加。当一个元素包含在另一个元素中时(假设没有填充或边框将边界分隔开),它们的顶和/或底边界也发生叠加,如图:元素的顶边界与父元素的顶边界发生叠加。尽管初看上去有点儿奇怪,但是边界甚至可以与本身发生叠加。假设有一个空元素,它有边界,但是没有边框或填充。在这种情况下,顶边界与底边界就碰到了一起,它们会发生叠加,如图:元素的顶边界与底边界发生叠加。如果这个边界碰到另一个 阅读全文
posted @ 2012-12-12 17:29 piuba 阅读(627) 评论(0) 推荐(0) 编辑
摘要:大多数情况下,jquery代码的编写,都要求我们将jquery的代码放在?123$(document).ready(function(){........jquery代码...........});上面的代码和?123$().ready(function(){........jquery代码...........});?123$(function(){........jquery代码...........});是等同的~~最后一种方式是最简洁的方式,绝大多数情况下我都使用最后一种写法,呵呵~~好记!注意:有时候我们自己编写的jquery代码出现莫名其妙的问题,看似正常的代码,但是就是在运行的时 阅读全文
posted @ 2012-12-11 10:34 piuba 阅读(270) 评论(0) 推荐(1) 编辑
摘要:产品介绍 WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaSscript IDE”等。与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能。功能关于JaveScript· 基于DOM,特定浏览器完成 · 编码导航和用法查询 · 支持ECMAScript · 支持CoffeeScript · 支持结点 · JavaScript重构· JavaScript单元测试 & 阅读全文
posted @ 2012-12-11 09:50 piuba 阅读(1334) 评论(0) 推荐(0) 编辑
摘要:从最初的dreamweaver,到Notpad++,再到aptana,每一款IDE总让我我感觉少了点什么东西。WebStorm却让我眼前一 亮,虽然公司项目所用的开发环境是eclipse+aptana(主要是方便团队协作和工程调试),但是其他时间我都会学习使用WebStorm,现在 4.0版本已经出来了,让我们来看看它都有哪些强大之处吧:浏览器支持细节提示关键字,标签,变量,参数和功能的JavaScript代码完成是基于支持DOM的流行的浏览器(IE,火狐等)标准,可以显示在不同浏览器之下的支持细节。智能的代码导航和搜索提示ECMAScript的Harmony支持WebStorm支持最新的EC 阅读全文
posted @ 2012-12-10 18:08 piuba 阅读(1750) 评论(0) 推荐(0) 编辑
摘要:SublimeText是一个代码编辑器(SublimeText2是收费软件,但目前可以无限期试用)也 是HTML和散文先进的文本编辑器。漂亮的用户界面和非凡的功能,例如迷你地图,多选择,Python的插件,代码段,等等。完全可自定义键绑定,菜单和 工具栏。SublimeText的主要功能包括:拼写检查,书签,完整的PythonAPI,Goto功能,即时项目切换,多选择,多窗口等 等。SublimeText 2被称作Windows下的TextMate,而根据其官网介绍,SublimeText的特点如下:拥有高效、没有干扰的界面,在编辑方面的多选、宏、代码片段等功能,以及很有特色的Minimap。 阅读全文
posted @ 2012-12-10 18:01 piuba 阅读(276) 评论(0) 推荐(0) 编辑
摘要:下面,我们先初步了解一下和匿名函数相关的概念。 函数声明(function 语句) 要使用一个函数,我们就得首先声明它的存在。而我们最常用的方式就是使用function语句来定义一个函数,如: 复制代码 代码如下:function abc(){ // code to process } function abc(){ // code to process } 当然,你的函数也可以是带参数的,甚至是带返回值的。 view plaincopy to clipboardprint? function abc(x,y){ return x+y; } function abc(x,y){ ret... 阅读全文
posted @ 2012-12-10 12:23 piuba 阅读(434) 评论(0) 推荐(0) 编辑
摘要:两年后,APMServ再出新版本──APMServ 5.2.6,升级了各集成软件的版本,增加了Nginx、Memcached、WinSCP,以及部分Linux命令的支持。 软件名称:APMServ 5.2.6 软件作者:张宴 授权方式:免费软件 发布日期:2008年10月21日 运行环境:WinNT/Win2000/WinXP/Win2003 文件大小:20.4MB 官方网站:http://apmserv.s135.com 讨论群组:http://blog.s135.com/apmserv/bbs/ 下载地址: ㈠官方下载点: [国内下载点①→新浪爱问CDN] htt... 阅读全文
posted @ 2012-12-06 10:27 piuba 阅读(199) 评论(0) 推荐(0) 编辑
摘要:PHP的程序很火,像博客:Wordpress、论坛:Discuz!、SNS:UCenter Home、CMS:DedeCMS等等都是比较流行的PHP程序,大家都在使用PHP类的程序,但对于很多初学者来说,直接上传到虚拟空间上一个一个调试 是很麻烦的事,那么在本地(我的电脑)中搭建一个PHP运行环境调试、测试程序是最快捷的方法。下面卢松松就介绍一些在本机快速搭建PHP运行环境的方 法,让不了解PHP的朋友能快速搭建一个属于自己的PHP运行环境。本地的PHP平台分为两种,一种是LAMP,即为Linux+Apache+MySql+PHP;另一种是WAMP,它是 Windows+Apache+MySq 阅读全文
posted @ 2012-12-05 23:25 piuba 阅读(294) 评论(0) 推荐(0) 编辑
摘要:jQuery主页:http://jquery.com/ 设计思想 简洁的思想:几乎所有操作都是以选择DOM元素(有强大的Selector)开始,然后是对其的操作(Chaining等特性)。 优点 小,压缩后代码只有20多k(无压缩代码94k)。 Selector和DOM操作的方便Chaining:总是返回一个jQuery对象,可以连续操作。 文档的完整,易用性(每个API都有完整的例子,这是其它框架现在不能比的),而且网上还有很多其它的文档,书籍。 应用的广泛,包括google code也使用了jQuery。 使用jQuery的站点:http://docs.jquery.com/Sites_U 阅读全文
posted @ 2012-12-05 11:24 piuba 阅读(2042) 评论(0) 推荐(1) 编辑
摘要:几个UI框架的比较k: 目前工作中可能会常用到几个UI框架,如Ext: http://docs.sencha.com/ext-js/4-1/#!/example感觉其过于复杂,性能不高,所以一直没有在项目中实践过。YUI: http://yuilibrary.com/Yahoo开发的一套UI框架,可惜不是基于jQuery的。jQueryUI: http://jqueryui.com/demos/tabs/#manipulationjQuery自带的一个可选UI库,但是非常可惜,一些关键的组件没有包含进去,如TreeView,DataGrid,还需要寻找第三方的插件。EasyUI: http:/ 阅读全文
posted @ 2012-12-05 11:08 piuba 阅读(712) 评论(0) 推荐(0) 编辑
摘要:这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录。先贴一个国内某大公司的代码:<script type="text/javascript"> function lang(key) { mylang = { 'ls_input_myb': '请输入您的账户', 'ls_myb_email': '漫游币账户为邮箱地址', 'ls_login_password': '请输入您的登录密码', 'ls_password_length': ' 阅读全文
posted @ 2012-12-04 11:20 piuba 阅读(392) 评论(0) 推荐(0) 编辑
摘要:radio、checkbox、select的验证其实方法与前面提到没有太大的区别,但问题是错误信息会显示在同一组的第一个元素后面,效果如下所示:解决这个问题的办法是将错误信息指定到一个特定的位置,validate()方法的参数中可以进行自定义,示例代码如下:View Code <script type="text/javascript"> jQuery.validator.addMethod("regex", //addMethod第1个参数:方法名称 function(value, element, params) { //addMetho 阅读全文
posted @ 2012-12-04 11:10 piuba 阅读(410) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示