Pages (21) « Prev 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 Next »

jquery弹出层插件-jquery alert v1.2(原创)

随着web2.0的发展,传统的页面交互技术已经不能满足人们更加苛刻的交互体验,你是否还在为网易邮箱完美的页面交互技术而感叹,为QQ邮箱的简单易用而自叹不如?其实,术业有专攻,我们只是一个人承担的工作太多太杂,没有那么多的时间、公司也没那么多的人力、物力成本而已。

我在大量的项目实践中,总结、开发出了此款jquery弹出层插件-jQuery Alert V1.2,该插件包括了六种类型的基本交互,确定型、确定/取消型、输入型、嵌入页面型、选择交互型、HTML片段型,我想已经能满足你所有的交互形式。该插件页面文档类型推荐使用<!DOCTYPE html>,毕竟要为html5考虑吧!

jQuery Alert V1.2特征:

1、完全基于jquery实现,有良好的扩展基础

2、全CSS定制样式,和你的页面完美融合

3、完美兼容主流浏览器,充分考虑到文档类型

4、使用简单,易于回调

5、可拖动,可定义插件样式、遮罩样式、偏移位置、按钮文本等

下载地址:点击下载jquery.alert.v1.2

需要的朋友,留下正确的邮箱,系统自动发送解压密码!

利用jquery.lazyload实现图片延迟加载

由于用户访问页面需要加载很多的图片,延迟加载技术在电子商务网站领域越来越普及,淘宝商城,京东商城,凡客等访问量巨大的电子商务站点为了增加用户用户体验,访问速度以及减少对自身服务器的压力,纷纷研发或使用延迟加载技术。当然如果没有前端开发的深入研究很难写出自己的js特效包。

jquery.lazyload.js就是一个基于jquery框架库的特效应用。它能让用户访问页面的时候,只加载当前屏幕所见内容的图片。

jquery.lazyload.js使用方法:首先页面需导入jquery.js。这个是先决条件,毕竟jquery.lazyload.js特效包是基于jquery框架库的!然后需到如Jquery.Lazyload.js。还需在本地服务器上传一张用来占位的图片grey.gif(可以是张很小的图片或者loading.gif之类表示正在加载的图片)。

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

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

<script type="text/javascript">

jQuery(document).ready(

function($){

$("img").lazyload({

   placeholder : /images/common/grey.gif,

   effect   : "fadeIn"

});

});

</script>

但是如果使用httpwatch等网页测试工具检测页面加载你会发现,图片其实是全部加载完了。因为执行js是在页面的page_load之后。所有,jquery.lazyload.js加载出来的只是图片的缓存文件。这样不就2次访问服务器加载图片了?即使jquery.lazyload.js加载的只是缓存图片...

解决办法:在jquery.lazyload.js的62行将 $(self).attr("original", $(self).attr("img")); 修改成 $(self).attr("original", $(self).attr("original"));  然后读图图片的时候将img= 替换成 original= 即可。凡客,淘宝商城都是这样的作法。这样才实现真正意义上的延迟加载。

jquery实现跨域提交(原创)

我们在运营一个产品的时候往往会遇到这样那样的表单提交,如客户数据收集、申请加盟、意见反馈等,由此我们开发了这样一个产品,可以理解为万能型数据收集平台,不难想到,我们在前端会遇到跨域的问题,比如 www.a.com 需要提交数据到www.app.com,以前我们用服务端代理来解决跨域问题,上次遇到一台windows服务器,实现代理比较麻烦,于是想到了jquery实现。他有两种方法,getJSON和getScript.

getScript我常用来获取服务端数据,getJSON可用于提交信息,其实两者均是实现跨域提交。

在jQuery1.3.2中,您可以通过使用JSONP形式的回调函数来加载其他网域的JSON数据,如"myurl?callback=?"。jQuery将自动替换?为正确的函数名,以执行回调函数。

Jsonp原理:

首先在客户端注册一个callback, 然后把callback的名字传给服务器。

此时,服务器先生成 json 数据。

然后以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数 jsonp.

最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。

客户端浏览器,解析script标签,并执行返回的 javascript 文档,此时数据作为参数,传入到了客户端预先定义好的 callback 函数里动态执行回调函数。

实例:

jquery代码:

$.getJSON("http://www.app.com/index.php?c=add&callback=?",{id: 10, name: "test"}, function(data){

alert(data.msg);

});

服务端返回:

jsonp1310628945031({"rs":true,"msg":"u60a8u7684u4fe1u606fu63d0u4ea4u6210u529fuff01"})

PHP代码:

$result['rs'] = false;

$result['msg'] = '您的信息提交成功!';

$json = new Services_JSON();

header('Content-Type: application/json');

echo $_GET['callback'].'('.$json->encode($result).')';

百度统计热力图邀请码

百度统计应该算是现在比较好的免费流量统计工具了,但高级点的功能需要邀请码,这里有十枚热力图邀请码,送给大家!

a5ad3bee63103a12 c322ed750fa995a9 72e18e512394d262 9a50066a616a990d cf58d21d1a264a97 c941fbbee9fd7950 76ccb9888007831c 665ffef677b145a2 6efc01053f6ee276 f4dab9212a5d45c2

到现在目前为止都可以使用,有使用到的同学请留言备注一下。

jquery日历插件simpleDatepicker修正版(原创)

原版地址:http://teddevito.com/demos/calendar.php

主要修改了以下几点:

1、中文支持

2、日期传递格式为 yyyy-mm-dd

3、默认在输入框正下方展开

4、增大年份选择区间

下载地址:点击下载

Pages (21) « Prev 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 Next »