在本文中,将介绍使用jQuery Mobile开发的一些常用的技巧,阅读对象为已经使用过jQuery Mobile进行开发的移动Web开发者. 1、禁止截断过长的列表和按钮内容 在jQuery mobile中,如果列表或者按钮中文字的内容过长,jQuery Mobile会自动截断其超过长度的内容,但如果不希望这样的话,可以在CSS样式中增加如下设置即可,比如下面的是针对按钮的CSS样式设置:.ui-btn-text {white-space: normal;}下面的是针对列表的CSS样式设置.ui-li-desc {white-space: normal;}如果要恢复对文字的截断,则继续设置CSS为white-space: nowrap; 2、实现页面加载时的随机页面背景过渡效果 jQuery Mobile中,当需要实现页面加载时,可以有很多的页面加载事件可供使用。比如下面的CSS和JavaScript代码,可以实现页面加载时的随机页面背景过渡效果。 CSS代码:.my-page { background: transparent url(../images/bg.jpg) 0 0 no-repeat; }.my-page.bg1 { background: transparent url(../images/bg-1.jpg) 0 0 no-repeat; }.my-page.bg2 { background: transparent url(../images/bg-2.jpg) 0 0 no-repeat; }.my-page.bg3 { background: transparent url(../images/bg-3.jpg) 0 0 no-repeat; }Javascript代码:$('.my-page').live("pagecreate", function() { var randombg = Math.floor(Math.random()*4); //获得0到3之间的随机数 $('.my-page').removeClass().addClass('bg' + randombg);});3、禁用button 在有的情况下,可能会需要禁止按钮的加载事件,这个时候可以继续通过如下的设置实现:$('#home-button').button("disable");如果要恢复可用,则设置为:$('#home-button').button("enable");4、去掉页面加载时的提示信息 如果在加载页面时,不需要显示页面加载信息时,可以通过设置一个属性来取消显示加载提示信息,如下:$.mobile.pageLoading(true);如果要继续保持显示页面加载信息,则为:$.mobile.pageLoading();5、创建自定义主题 jQuery Mobile本身提供了A-E五种不同的主题,但可以自定义主题,步骤如下: 1.从jQuery Mobile的任意一个定义主题的CSS文件中,复制其内容到自己定义的CSS文件中。 2.给要自定义的CSS主题一个恰当的名称并且重新命名CSS文件,注意命名必须是(a-z)英文字母,比如你是从jQuery Mobile的主题c的样式文件中复制的,则可以将主题命名为Z,则复制过来的内容中,比如要将.ui-btn-up-c改为.ui-btn-up-z,.ui-body-c改为.ui-body-z,如此类推。 3. 改变新建立的自定义主题的颜色和CSS文件。 4. 最后,需要在页面中,应用新定义的主题样式,如下:<div data-role="page" data-theme="z"></div>6、使用自定义字体 在移动Web应用中,有的时候需要更换字体,这样的话,可以通过使用@font-face方法实现,并且性能是十分好的。具体关于@font-face的使用,请参考http://www.sitepoint.com/the-fontface-jquery-plugin/这篇文章。 7、创建一个没有文本只有图片的按钮 有时,可能想用一个没有文本内容仍具有按钮特性的一个按钮。如果要在按钮上隐藏文本,设置data-iconpos="notext",例如:<a href="../index.html" data-icon="grid" claa="ui-btn-right" data-iconpos="notext">Home</a>8、打开一个无需使用Ajax页面过渡的超链接 如果不需要使用Ajax打开一个页面的链接,可以设置链接的rel属性,如下:<a href="../index.html" data-icon="grid" class="ui-btn-right" rel="external">Home</a>9、移除项目列表中的箭头 默认情况下,jQuery Mobile框架会为每一个列表项添加一个箭头,想要禁用箭头显示,需要在想要移除列表项设置data-icon="false"。<li data-icon="false"><a href="contact.html">Contact Us</a></li>10、设置页面的背景颜色 怎样在不修改jQuery Mobile样式下设置一个页面背景颜色的?听起来很简单,其实需要花几分钟时间才能解决。通常情况下,需要在body元素中设置背景颜色,但是用jQuery Mobile框架,需要设置在ui-page类中。.ui-page{ background:#eee;}
为了熟悉下bootstrap框架,如果做站就用bootstrap,在点点主题上面也啃了很久,总算是有个能看得过去的主题了.主题比较简洁亮白,也有朋友问我要主题风格,之前代码没做什么整理,刚整理了下代码,添加些注释,顺便加了一个图片演示加载的效果,这个效果很棒,我做主题,一直采用的.使用注意:修改google统计代码修改多说使用的代码修改文章内的个人说明修改微博导航链接 这些代码都是写死成我的链接的,请修改成你自己的吧!下载: 百度网盘 | github | bootstrap4diandian源码
bootstrap采用是glyphicons提供的免费图标,有140个图标,完整的有400多个,在国外一网站找到个下载的,并且用sprite写好了css,相当好用. 下载:百度云网盘
做代码迁移,要把oracle迁移到db2上面,遇到了substr的使用,老是报错.原因是oralce的substr的postion从0开始,而db2的substr的postion从1开始,这个设计有些不合常规了啊!程序猿数数的时候都是从0开始的啊!
收到新浪SAE的几个JAVA邀请码,放出来让有需要的人用用.9a0ce8 fcc5b3 793dab d965c8 d98211百度也出了它的BAE,PHP JAVA版本的我都试用过,就是垃圾,想用点框架啊,js啊,限制一大堆,不好用. 新浪的SAE也有限制,曾经也说不好用,现在也有BAE做比较,也能说,可以试试用了.
一直是世界之窗的用户,自从世界之窗被数字给收购后,名字改成360浏览器,做的相当的不错,急速版的浏览器也是chrome浏览器在第三方浏览器中做的最好的一个,比什么太阳啊、枫树的好的多。最新的V6,界面很给力如果不在乎数字的,推荐使用! 我使用的还是chrome原版的,chrome太吃内存了,插件是精简了再次精简,还是很重。在airplay的友情链接中发现了云游浏览器,第三方的chrome浏览器,个人制作,简单试用了下,有世界之窗急速浏览器的习惯,果断的设为默认浏览器,推荐使用。