CSS3响应式侧边菜单 菜单带小图标

今天我们要来分享一款基于CSS3的响应式侧边菜单,这款菜单可以在PC浏览器网页上和移动设备的网页上有着同样不错的效果,它会根据屏幕大小自动实现菜单位置的变化,可以让用户在不同分辨率的屏幕上获得最佳的体验。

css3-responsive-menu

在线演示源码下载

CSS3图片模糊效果

今天我们来分享一款利用CSS3技术让图片模糊的效果,我们只需要将鼠标滑过图片,就可以让图片产生模糊的特效,利用CSS3实现图片模糊效果也非常简单,用CSS3中的filter属性即可,针对不同浏览器用-webkit-filter、-moz-filter、-o-filter和-ms-filter。

css3-image-fuzzy

在线演示源码下载

jQuery自定义Select下拉框 可自动滚动

今天我们要分享一款很实用的jQuery自定义Select下拉框,它的外观不仅比浏览器自带的下拉框要漂亮,而且在选择的时候还可以自动滚动下拉框选项,用户体验非常不错。之前我们也分享过一些用CSS3和HTML5制作的下拉框,比如:HTML5/CSS3自定义抖动表单

jquery-select-auto-scroll

在线演示源码下载

jQuery实现冒泡、插入排序算法动画演示

今天我们来分享一款绝对让你震撼的jQuery插件,它可以模拟各种排序算法的动画,让你很直观的了解各种排序算法实现的原理,如果你纯粹想看排序算法动画,那么可以选择fast速度模式,如果想知道原理,那就选择slow速度模式,这里提供了插入排序、冒泡排序、鸡尾酒排序这三种动画。

jquery-sort-animation

在线演示源码下载

纯CSS3背景图标渐变按钮

今天我们要来分享一组非常可爱的CSS3按钮组合,这款按钮的效果是当你把鼠标滑过它们时,按钮上的背景小图标就会发生渐变效果,类似淡入淡出的特效。类似这种炫酷的CSS3按钮还有很多,比如纯CSS3实现动感弹性按钮,动画效果也非常不错。

css3-icon-bg-animated-button

在线演示源码下载

Java字符串的10大热点问题盘点

本文是html5tricks原创翻译,转载请看清文末的转载要求,谢谢合作!

下面我为大家总结了10条Java开发者经常会提的关于Java字符串的问题,如果你也是Java初学者,仔细看看吧:

1、如何比较字符串,应该用”==”还是equals()?

总的来说,”==”是用来比较字符串的引用地址,而equals()才是比较字符串的值。两个值相同的字符串用”==”比较结果有可能是false,而用equals()则一定为true。除非两个字符串是同一个new出来的对象,不然比较字符串值是否相同应该要用equals()。

2、对那些安全敏感的信息,为什么用char[]存储要优于String?

String是不可变的,这就意味着它一旦被创建,就将永久驻留在内存中,直到垃圾回收器将其回收为止。然而用数组存储方式,你可以明确地改变数组中的元素,因此用数组方式,安全信息将有可能不存在系统内存的任何地方。

3、能否用字符串来声明switch语句?

JAVA 7及以后的版本是支持的。在JDK 7中,允许你使用字符串做switch语句的比较条件。jdk 6以前的版本,不能这样使用:

//[......]

阅读全文>>

12款基于SVG的HTML5应用和动画

SVG是HTML的扩展标记语言,利用SVG可以做非常多的矢量动画,结合HTML5,SVG就变得更加强大。下面12款HTML5动画均基于SVG,一起来看看。

1、HTML5 SVG 3D蝴蝶飞舞动画 逼真超酷

这次我们要分享的这款HTML5动画简直就是逆天,利用SVG制作的3D蝴蝶飞舞动画,蝴蝶飞舞动画非常逼真,蝴蝶飞舞的路线是利用SVG构造的。另外,动画使用了一张立体感很强的天空背景图,让蝴蝶飞舞时更加显得立体逼真。

html5-3d-butterflies

在线演示        源码下载

2、一组HTML5 SVG可爱的笑脸动画

今天我们来分享一组利用HTML5和SVG实现的可爱笑脸动画,它们是色彩各异的一组泥娃娃的脸,默认的时候就出现眨眼和微笑的动画,当你把鼠标滑过它们时,就像是感受到了主人的抚摸一样上下跳动起来,真的是非常可爱。

html5-svg-smile-faces

在线演示        源码下载

3、HTML5 SVG圆盘时钟动画 5种时钟样式

今天我们要来分享一款基于HTML5和SVG的圆盘时钟动画,首先,圆盘时钟的时间是和你的本地时间同步的,因此,你完全可以用它来看上网时间。另外,这款HTML5圆盘时钟提供了[......]

阅读全文>>

jQuery宽屏带文字描述焦点图插件

之前我们介绍过一些很酷的jQuery焦点图插件,像jQuery纵向滑块焦点图插件jQuery/CSS3实现全屏图片滑块焦点图动画,都非常不错。今天要分享一款jQuery实现的宽屏焦点图插件,而且每一张图片都带有文字描述,图片滑动效果也比较流畅。

jquery-adaptive-image-slider

在线演示源码下载

为什么我们不建议用Table布局

  1. Table要比其它html标记占更多的字节。
    (延迟下载时间,占用服务器更多的流量资源。)
  2. Tablle会阻挡浏览器渲染引擎的渲染顺序。
    (会延迟页面的生成速度,让用户等待更久的时间。)
  3. Table里显示图片时需要你把单个、有逻辑性的图片切成多个图。
    (增加设计的复杂度,增加页面加载时间,增加HTTP会话数。)
  4. 在某些浏览器中Table里的文字的拷贝会出现问题。
    (这会让用户不悦。)
  5. Table会影响其内部的某些布局属性的生效(比如<td>里的元素的height:100%)
    (这会限制你页面设计的自由性。)
  6. 一旦学了CSS知识,你会发现使用table做页面布局会变得更麻烦。
    (先花时间学一些CSS知识,会省去你以后大量的时间。)
  7. table对对于页面布局来说,从语义上看是不正确的。
    (它描述的是表现,而不是内容。)
  8. table代码会让阅读者抓狂。
    (不但无法利用CSS,而且会你不知所云)
  9. table一旦设计完成就变成死的,很难通过CSS让它展现新的面貌。
    (你看过CSS Zen Garden吗?)

Tables的[......]

阅读全文>>

HTML5 webkit 3D立方体图片旋转滑块应用

今天再来分享一款HTML5 3D立方体动画,这个只是一个3D效果模型,你可以用图片替换演示中的立方体4个面,这样就可以将这款HTML5立方体旋转动画改造成HTML5 3D焦点图了,由于是基于webkit的,所以有浏览器限制,Google Chrome最佳。

html5-webkit-3d-cube-slider

在线演示源码下载