共有日志：1865 篇 | 共有评论：1486 篇

当前位置：首 页>> 百 宝 箱

CSS-ONLY 内容展示切换效果 微信扫一扫
分享给朋友

作 者：笑傲江湖分 类： 百 宝 箱 发布于：2012年-6月-13日 15:44 星期三

　　此展示效果，宽高自适应浏览器窗口大小，且仅使用CSS完成切换效果。切换导航按钮使用的是Radio button组合，通过CSS来切换不同内容，切换效果平滑。因为是使用了CSS3的很多属性，所以IE9以下的全军覆没，看不到效果，但还能切换。新版浏览器如Chrome、Firefox、Opera、Safari都没啥问题。
　　原先演示内容英文的，俺翻译＋替换成了中文，增加了图片背景，其他未动。喜欢的同学可以自己定制。点击下面图片查看演示。
CSS-ONLY 内容展示切换效果

SmoothTransitionsResponsiveLayout.zip
200.31KB

标 签：CSSCSS3HTMLTRANSITIONSCROLL

评 论2 引 用0 浏 览3608

人到穷途应一笑，几凡失意仍能傲。成败何须问江湖，我心依旧任逍遥。
这一生只想好好做个平凡的人，有个家有个梦，陪我迎接每一个早晨。
这一生只想好好做个平凡的人，何必争何必问，只有快乐开心才是真。