burberryshow:腾讯Burberry线上营销页面特效

时间:2024-07-24 01:14:28
【文件属性】:

文件名称:burberryshow:腾讯Burberry线上营销页面特效

文件大小:1.67MB

文件格式:ZIP

更新时间:2024-07-24 01:14:28

JavaScript

腾讯Burberry线上营销页面特效 4月24日,Burberry亚太地区规模最大的旗舰店在上海开幕。Burberry突破性地运用了诸多创新的数字营销模式,借助与腾讯的合作,为更多未能到场的用户创造了一个“平行的体验”,也正式开启了Burberry的创新数字营销之旅。 其中多次用到了开头的图片中类似于云雾褪去的效果。 我对这种神奇的特效产生的极大的兴趣,于是通过chrome的审查元素里面Resources找到下面这张图片(由于图片是白色的png,为了让大家看清楚我将背景调成了黑色)。 于是效果的实现方式就显而易见了,是利用css3的-webkit-mask来实现的。 -webkit-mask类似于photoshop里面的蒙板,在背景图片上加上一层蒙板,背景中的图片会透过蒙板中的白色部分显示出来,蒙板中的透明部分则遮挡住了背景。 ####Step1.为背景加上蒙板 <body> <div


【文件预览】:
burberryshow-master
----images()
--------Touch1.jpg(57KB)
--------2.gif(120KB)
--------Touch1.png(19KB)
--------txqr.png(1KB)
--------3.gif(459KB)
--------xg.gif(547KB)
--------1.jpg(69KB)
----spriteClip.js(1KB)
----README.md(9KB)
----index.html(4KB)
----img()
--------Touch1.png(19KB)
--------bg2.jpg(95KB)
--------Touch3.png(21KB)
--------Touch4.png(180KB)
--------bg.jpg(111KB)
--------Touch2.png(27KB)

网友评论