重庆网站建设公司润雪科技
业成于勤
,守于挚
技精于专
,做于细
重庆网站建设 新闻动态 公司动态

7个创意的文本展示效果

2018-09-28      发布者:润雪科技      浏览量:1502

之前看到国外的一些网站的文章内容页,有些喜欢使用一张大图来作为标题背景,当用户向下滚动页面时背景图标固定或以渐隐的形式消失,并带有些视差效果,真的很有趣。
  这可以算是一个微创新,大家可以尝试这种交互增加你的文章展示效果,但怎么实现呢?

作者制作了7个相关的文章展示效果案例,每个都有不同的特别,下面一起来看看有什么不同吧:

效果1:PUSH

PUSH的效果是当用户向下滚动页面时,图片会向上渐隐,而文章内容会跟着从下至上的渐显出来。


image.png


效果2:FADE OUT

FADE OUT背景图像也是向上渐移,不同的是,图像不会消失,但注意的是,图像下方有个渐变的过渡,让用户看起来很舒适。


image.png


效果3:SLICED

SLICED独特之处就是图像像被切割一样从图像的中心开始切开动画。


image.png


效果4:SIDE

Side就是向下滚动页面时,图像会以侧边形式展示。


image.png


效果5:FIXED SIDE

有点类似Side,但图像是布满上下屏幕,效果很不错。


image.png


效果6:GRID

Grid效果如下图,当用户向下滑动页面时,图像变回Grid列表形式,这可以让用户看到自己在读那篇文章。


image.png


效果7:Jam3

最后一个效果是作者模仿 Jam3 网站制作出来的,用户向下滑动网页,图像会自动切成一个小banner。


image.png


这些文章效果看起来确实很赞,但因为带有动画效果,这样却给用户延迟了一阅读

 


本文由重庆网站建设公司润雪科技原创,文章地址:http://www.runxuekeji.com/news/id/1573.html

重庆网站建设公司 - 润雪科技

地址:中国 · 重庆市南岸区南坪亚太商谷7幢23-10、23-11        电话:400-807-5908        手机:186-9655-6121        客服QQ:714-287-173

重庆网站建设公司润雪科技,专注于重庆网站建设重庆网站制作重庆网站设计重庆做网站,公司都秉承以“产品”为核心“用户”为中心,从实际出发为客户提供更优质的服务为宗旨,联系电话:400-807-5908
COPYRIGHT (©) 2017 网站建设公司润雪科技渝ICP备15012622号