css实现翻书图片轮换过渡效果代码

代码语言:html

所属分类:幻灯片

代码描述:css实现翻书图片轮换过渡效果代码

代码标签: 图片 轮换 过渡 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">




    <style>
        :root {
          --duration: 500ms;  
          --ease-in: cubic-bezier(0.85, 0, 1, 1);
          --ease-out: cubic-bezier(0, 0, 0.3, 1);
          --ease-in-out: ease-in-out;
          --image-current: url(//repo.bfw.wiki/bfwrepo/image/5e62ef20b92ee.png);
          --image-next: url(//repo.bfw.wiki/bfwrepo/image/5e62ef60656fd.png);
        }
        
        html, body, section {
          height: 100%;
        }
        
        @-webkit-keyframes zoom-1 {
          0%, 100% { transform: scale(0.8); }
          50% { transform: scale(0..........完整代码请登录后点击上方下载按钮下载查看

网友评论0