09 2012 档案
摘要:带三角箭头的提示框,就是下面所示:这是一个提示框通常我们都用图片来实现上面那个小三角,因为这样方便快速,但是如果图片处理得不好,会看起来有杂边,从而影响视觉,所以换一种思路来解决。首先来研究一下CSS是如何实现三角形的。假定有一个盒子(div),给定宽高分别为100像素,再给定边框50像素,那么它看起来会是下面这个样子(为了更直观,给了边框四种不同的颜色):接下来,把盒子的高度设为0:再把宽度也设为0:这样雏形就已经出来了,由于IE6的bug(高度为0的div会有一定默认的高度,我的电脑上测量结果为19像素),需要做一些小调整,给div加一个overflow:hidden,IE6就能正确解析了
阅读全文
摘要:Freetile.jsFreetile will organize your content in an efficient, dynamic and responsive layout. It can be applied to a container element and it will arrange it's children in a layout that makes optimal use of screen space, by "packing" them in tightly.Freetile.js →Responsive Carouselres
阅读全文
摘要:智能手机已走进人们生活的方方面面,优秀的手机应用程序都有类似的特点:设计优雅,便于使用,并且满足用户需要。最糟糕的应用程序是以千奇百怪的方式呈现,让消费者像张二的和尚摸不到头脑。以下五点我们应该引以为戒,避免在应用程序设计中再犯。1.避免激进主义喜欢自己设计的应用程序无可厚非,但是不可想当然的强加与他人。太多功能或者应用加入到设计中,可能会因为在某种程度上加大应用程序的复杂性,而不被用户喜欢。 让我们回顾一下Bump的发展历程,也许会恍然大悟,最初这款软件的主要特性就是快速、方便的在不同的手机间实现信息的互通,允许你将音乐传输、应用推荐、联系信息、照片和其他东西传输给朋友,但由于设计的复杂性和
阅读全文
摘要:这些天忙于公司项目的改版就很少来这里发表文章了,今天趁着周末休息给大家分享一个jQuery提示控件。可用于显示加载提示、错误提示、操作提示等。先上张预览图:提示条样式可以自己定义,支持关闭回调和锁屏,自适应居中,采用fixed定位(暂未考虑兼容IE6)。下面是源码:(注:引入该JS时放在body内,不然没效果,原因不明。)/** * tooltip提示 * @author Newton---承諾ン祗愛 * @date 2012年04月19日晚 * @update 2012年04月23日重构,保证一个实例的关闭函数只能触发自身的关闭事件,加入动画缓动支持。 * @param object{} *
阅读全文
摘要:在上一篇文章 《鼠标事件延时切换插件》 中,我已经写了几个简单的延时器的例子,今天突然想到jQuery的自定义动画的animate方法可以使用delay,例如:1$('#foo').slideUp(300).delay(800).fadeIn(400);// 在.slideUp() 和 .fadeIn()之间延时800毫秒。hover是否可以设计一个延时器呢?答案是肯定的。延时操作目的是为了防止用户误触发事件,一般情况下鼠标指针小于150毫秒的停留时间都可以被忽略。其实,如果入侵delay全能让其作用在hover事件上,但是为了避免John Resig不断的折腾jQuery而导
阅读全文