代码改变世界

jquery mobile的一些插件(图片滚动)

2012-11-16 10:19 by 滴水成兵, 5542 阅读, 0 推荐, 收藏, 编辑
摘要:1,photoswipe网址:http://www.photoswipe.com/demo:http://www.photoswipe.com/latest/examples/04-jquery-mobile.html个人描述:在手机上操作很流畅,能自使用屏幕尺寸,竖屏显示效果很好,横屏图片太大了,也就是列数固定的原因。2,Touch-Gallery网址:http://neteye.github.com/touch-gallery.htmldemo: 在首页在左下角个人描述:就是一个图片箱子插件,点击图片放大,周围变黑遮罩,双击周围返回列表,还未有在手机测试,但是上面写着iphone / ip 阅读全文

关于jquery mobile 动态添加<lable>

2012-07-16 15:49 by 滴水成兵, 410 阅读, 0 推荐, 收藏, 编辑
摘要:这两天搞 mobile 真是搞的头都大了,动态添加“lable” 和“list”还是有些差别的,查了些资料 国内提及的还是太少...部分代码js:$("#submit").live("click", function() { var markup = "",i=1; markup +="<label class='edit'><input type='checkbox' class='custom' /><img src='../user- 阅读全文

关于jquery mobile 调用后台数据的问题

2012-07-13 10:10 by 滴水成兵, 1111 阅读, 0 推荐, 收藏, 编辑
摘要:mobile无疑使一款非常强大的移动开发框架,但是很多方法不能用传统ajax 请求的方法去请求数据。最后中叶找到了个解决的办法,先贴代码吧:$(function(){ $.mobile.showPageLoadingMsg(); $.ajax({ url: "data.json", type: "POST", dataType: "script", success : function(data) { var oData = eval(data); var markup =''... 阅读全文

分享个好玩的东西-html5拍照

2012-07-10 10:27 by 滴水成兵, 447 阅读, 0 推荐, 收藏, 编辑
摘要:好久没写了,先贴出拍照的代码(建议用opera浏览器测试)<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=yes"> <meta name="description" content="A Polaroid-style 阅读全文

css3之border-radius

2012-03-17 18:31 by 滴水成兵, 366 阅读, 0 推荐, 收藏, 编辑
摘要:本来想着弄个可以运行的程序,省得再复制麻烦。后台总是屏蔽标签,哎....今天说下css3中border-rudius 这个属性:网上介绍的文章很多,比我牛X的人比比皆是,我在这就当给自己做个备忘录,如果不幸能给你带了少许帮助,那在下真是荣幸之至。首先,说下兼容下问题,由于浏览器厂商为了自己的利益,都想弄个自己的私有属性,真是无商不奸,被所有我们做前端的同学们嗤之以鼻。没办法,谁让人家是大牛,咱只是个民工呢,事还得做啊下面是不同内核浏览器的简写形式:1、Mozilla(Firefox, Flock等浏览器)-moz-border-radius: 2、WebKit (Safari, Chrome等 阅读全文

html5钟表效果

2012-03-13 17:16 by 滴水成兵, 552 阅读, 0 推荐, 收藏, 编辑
摘要:看见有钟表的效果不错:<!DOCTYPE><html lang="en" id="paulrhayes-com" class="js wf-swingdancer1swingdancer2-n5-active wf-active"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"><link rel="stylesheet" 阅读全文

javascript异步加载

2012-03-13 14:56 by 滴水成兵, 240 阅读, 0 推荐, 收藏, 编辑
摘要:默认情况javascript是同步加载的,也就是javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,对于一些意义不是很大的javascript,如果放在页头会导致加载很慢的话,是会严重影响用户体验的。异步加载方式:(1) defer,只支持IE(2) async:(3) 创建script,插入到DOM中,加载完毕后callBack,见代码:function loadScript(url, callback){var script = document.createElement("script")script.type = &q 阅读全文

CSS3 box-shadow实现纸张的曲线投影效果

2012-03-13 14:31 by 滴水成兵, 471 阅读, 1 推荐, 收藏, 编辑
摘要:一、简单的前言一般的投影效果,尤其通过CSS实现的投影效果(无论是CSS3,还是IE滤镜),都是直来直往的。纸张是有卷角的,其投影就是曲面的,如何使用CSS模拟出纸张的卷边曲线投影效果就是本篇的内容了。二、实现原理简介首先,曲线投影的终效果其实是多投影重叠的效果:一点点倾斜的投影重叠一个直直的投影。一般的直来直往的投影显然是使用box-shadow属性就可以搞定了。至于那个倾斜的投影,如果是现代浏览器,则需要就是CSS3变换属性transform。首先是倾斜,5度左右的样子,然后让其在主投影的后面显示就可以了。然后,单单只有倾斜是不够的,因为有一个脚会从一侧露出来,这很好理解。假设两个矩形一样 阅读全文

简单的放大镜效果

2012-03-13 14:05 by 滴水成兵, 205 阅读, 1 推荐, 收藏, 编辑
摘要:很多电子商务网站都用到放大镜效果,在这写了个简单的效果View Code <!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" 阅读全文

纯css实现圆角

2012-03-13 11:47 by 滴水成兵, 357 阅读, 0 推荐, 收藏, 编辑
摘要:其实用纯css实现圆角的方法有不少,这里我是通过对元素border的操作来实现防圆角,圆弧如果太大效果可能就不是太好了,废话不多说直接上代码吧:css部分.box{display:inline-block;}.top{border-bottom:3px solid; border-top-color:#cc0000; border-bottom-color:#cc0000; border-left:3px dotted transparent; border-right:3px dotted transparent;}.center{padding:10px 20px; color:white 阅读全文