snap左侧菜单弹出动画效果代码

代码语言:html

所属分类:菜单导航

代码描述:snap左侧菜单弹出动画效果代码

代码标签: 弹出 动画 效果

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

<!DOCTYPE html>
<html lang="en" class="no-js">
       
<head>
               
<meta charset="UTF-8" />
               
<meta http-equiv="X-UA-Compatible" content="IE=edge">
               
<meta name="viewport" content="width=device-width, initial-scale=1">
               
<title></title>
               
<meta name="description" content="Adding elasticity with SVG shape animations" />
               
<meta name="keywords" content="svg, morph, snap.svg, effect, animation, css, shape" />
               
<meta name="author" content="Codrops" />
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/classie.js"></script>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<style>
   

*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }

body {
        color: #fff;
        background: #2f3238;
        font-weight: 400;
        font-size: 1em;
        font-family: 'Raleway', Arial, sans-serif;
}

a {
        color: #B24E51;
        text-decoration: none;
}

a:hover,
a:focus {
        color: #afb3b8;
        outline: none;
}

.theme-2 { background: #434d55; }
.theme-2 a { color: #4991C2; }
.theme-2 a:hover, .theme-2 a:focus { color: #74777b; }

.theme-3 { background: #e4eaea; color: #74777b;}
.theme-3 a { color: #e35583; }
.theme-3 a:hover, .theme-3 a:focus { color: #74777b; }

.theme-4 a { color: #6EAE8C; }
.theme-4 a:hover, .theme-4 a:focus { color: #74777b; }

.theme-5 { background: #e4eaea; color: #74777b;}
.theme-5 a { color: #EA8686; }
.theme-5 a:hover, .theme-5 a:focus { color: #74777b; }

.theme-6 a { color: #CFB75C; }
.theme-6 a:hover, .theme-6 a:focus { color: #74777b; }

.theme-7 { background: #E8E8E8; color: #FF72AD;}
.theme-7 a { color: #415c71; }
.theme-7 a:hover, .theme-7 a:focus {.........完整代码请登录后点击上方下载按钮下载查看

网友评论0