jquery实现全屏滚动视觉差异效果代码
代码语言:html
所属分类:视觉差异
代码描述:jquery实现全屏滚动视觉差异效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> *, *::after, *::before { box-sizing: border-box; } html { font-size: 62.5%; } body { font-size: 1.6rem; font-family: sans-serif; color: #fff; background: #333; } section { overflow: hidden; } .product-hero { position: fixed; bottom: 0px; left: 0px; right: 0px; z-index: 1; height: 100%; } .product-hero .image { position: absolute; top: 0px; left: 0px; z-index: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; background-image: url("//repo.bfw.wiki/bfwrepo/image/6454c4ca0d59b.png"); opacity: 0.25; transition: all .8; } #page { position: relative; margin: 100vh .........完整代码请登录后点击上方下载按钮下载查看
网友评论0