css实现三维风车相册画廊效果代码
代码语言:html
所属分类:画廊相册
代码描述:css实现三维风车相册画廊效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> body { background: #f5f5f5; } #stage { margin: 1em auto; padding-left: 380px; padding-top: 50px; height: 160px; perspective: 1200px; } #spinner { animation-name: spinner; animation-timing-function: linear; animation-iteration-count: infinite; animation-duration: 6s; transform-style: preserve-3d; } #spinner:hover { animation-play-state: paused; } img { position: absolute; border: 1px solid #ccc; background: rgba(255,255,255,0.8); box-shadow: inset 0 0 20px rgba(0,0,0,0.2); } @-webkit-keyframes spinner { from { -webkit-transform: rotateY(0deg); } to { -webkit-transform: rotateY(-360deg); } } </style> </head> <body translate="no"> <div id="stage" style="; "> <div id="spinner" style="-webkit-transform-origin: 180px.........完整代码请登录后点击上方下载按钮下载查看
网友评论0