jquery+glide实现步骤条选项卡点击切换状态效果代码
代码语言:html
所属分类:选项卡
代码描述:jquery+glide实现步骤条选项卡点击切换状态效果代码
代码标签: jquery lide 步骤条 选项卡 点击 切换
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/glide.core.2.0.9.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/glide.theme.2.0.9.css">
<style>
body {
background: #d6d4db;
background: linear-gradient(45deg, #d6d4db 0%, #c1dfe3 100%);
font-family: "Lato";
}
html, body {
min-height: 100%;
}
*, *:after, *:before {
box-sizing: border-box;
margin: 0;
padding: 0;
}
a {
color: #7958A6;
text-decoration: none;
transition: color 0.2s ease-in-out;
}
a:hover {
color: #553d74;
}
.glide {
height: auto;
margin-top: 60px;
}
.glide__bullets {
display: flex;
justify-content: space-between;
left: 0;
margin: 0 auto;
right: 0;
top: -60px;
width: 300px !important;
}
.glide__bullets button {
position: relative;
}
.glide__bullets button:before {
color: #5C557A;
position: absolute;
left: 50%;
margin-left: -50px;
padding: 15px 0;
width: 100px;
overflow: auto;
}
.glide__bullets button.active:before {.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0