jquery实现手风琴式折叠时间线效果代码-html代码-BFW代码库

jquery实现手风琴式折叠时间线效果代码

代码语言：html

代码描述：jquery实现手风琴式折叠时间线效果代码

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

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
<style>
body {
    padding: 10px;
/* background-color: cadetblue; */
}
.box {
border: 1px solid black;

background-color: #34495e;
margin: auto;
}
.foldDivs {
display: none;
}
.content>div {
float: left;
}
.title {
width: 100%;
text-align: center;
padding: 10px;
font-size: 18px;
background-color: #413d3d;
color: white;
}
.content {
width: 100%;
height: 180px;
/* background-color: black; */
}
.content-left {
width: 49%;
height: 100%;
position: relative;
/* background-color: blanchedalmond; */
overflow: hidden;
}
.line {
height: 100%;
width: 2%;
position: relative;
/* background-color: #d9d9d9; */
overflow: hidden;
}
.content-right {
height: 100%;
width: 49%;
position: relative;
/* background-color: #8f8888; */

}
.midden-line {
width: 3px;
height: 100%;
background-color: rgb(127, 168, 255);
margin: auto;
position: relative;
}
.node {
width: 15px;
height: 15px;
border-radius: 50%;
position: absolute;
top: 15%;
left: 50%;
transform: translate(-50%,-50%);
background-color: white;
border: 3px solid #f1c40f;
}

.content-left .content-left-box {
width: 70%;
height: 90%;
/* background-color: cor.........完整代码请登录后点击上方下载按钮下载查看