swiper3滑屏插件!
原理是利用最大层百分百固定一个框!
然后里面用transform: translate3d(0px, -0, 0px)来进行滑动!
具体每个背景图的使用则是把每一个层都是百分百的宽高!
然后背景图
background-image:url()background-repeat: no-repeat
background-position: bottom right
//核心区分点
//让背景比例不变
background-size: cover
//让背景充满屏幕
background-size: 100% 100%
//或者让背景宽度100% 高度自动
background-size: 100% auto
//让背景高度100% 宽度自动
background-size: auto 100%
在一个div里面设置两张背景图片用css3的多背景可以做到,写法也很容易,类似下面这样就行了:background:url(top.jpg) center top no-repeat,
url(bottom.jpg) center bottom no-repeat
不过因为不同浏览器对于CSS3的支持度有限,这种写法在大多数浏览器里面,特别是IE里面是无效的。所以通常的作法还是嵌套两个div,一个div里面是上面的背景图,一个div里面是下面的背景图,这样的兼容性会好一些。