您的位置: 首页 > 资讯 > 设计

提升设计品质的8种布局方案

亚博备用网址 | 时间: 2010-04-14 14:47:14 | 文章来源: 中国设计之窗

 

用于展示产品的滑门样式与上面的例子对应,滑门不仅能用于大容量信息的组织,也能为用户浏览大量产品条目提供方便。 SourceBits (见下图)使用了多层滑门(一个水平的,一个垂直的),用唱片封面作为导航条目。

水平滑门两端都有大的圆形箭头图标,实时反映左右导航的可用性。滑动的时候有平滑的动画,用起来非常舒服。同时,你也能看到,各个元素间距都精心设计过,这有助于内容组织,也提升了可用性。鼠标滑过时,每个条目还有漂亮的聚光灯效果。

Screenshot

垂直滑动的内容以及超大的水平“点击条” 接下来看看 QuickSnapper 的滑门。这是一个完美融入页面整体布局的十分好用的垂直滑门。滑门内容中有大量截屏图,内容被有序地组织起来。这个滑门最赞的地方就是上下方的按钮导航。按钮宽及整个滑门,大的按钮让“推拉”滑门更加容易。

还有,这些按钮的:active和:focus效果也很漂亮。

Screenshot

滑门脚本

你可以参考下面的脚本、技巧和教程制作你自己的滑门:

   上一页   1   2   3   4   5   6   下一页  


 

凡注明 “亚博备用网址” 字样的视频、图片或文字内容均属于本网站专稿,如需转载图片请保留 “亚博备用网址” 水印,转载文字内容请注明来源亚博备用网址,否则本网站将依据《信息网络传播权保护条例》维护网络知识产权。

打印文章    收 藏    欢迎访问亚博备用网址论坛 >>
发表评论
用户名   密码    

留言须知

 
 
延伸阅读