jquery实现公司发展历程大事记时间轴效果代码-html代码-BFW代码库

代码语言：html

代码描述：jquery实现公司发展历程大事记时间轴效果代码

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
		<meta http-equiv="Content-Type" content="text/x-component" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<style>
    @charset "utf-8";/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td {margin:0;padding:0;}
body {color:#595959;font-size:12px;font-family:"微软雅黑";position:relative;background:#fff;}
td,th,caption {font-size:12px;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;font-size:100%;}
address, caption, cite, code, dfn, em, th, var{font-style:normal;font-weight:normal;}
a{color:#000;text-decoration:none;}
a:hover {cursor:pointer;text-decoration:none;}
a{blr:expression(this.onFocus=this.blur())}
*:focus{outline:0;}
fieldset,img {border:none;}
ol,ul,li {list-style:none;}
span,i{display:inline-block;font-style:normal;}
input, textarea, select, button {font:12px "微软雅黑";;outline:none;}
table{border-collapse:collapse;border-spacing:0;}
textarea {resize:none;}

/*关于我们start*/
.about_bg{position:fixed;width:100%;height:100%;top:0;left:0;background: url(//repo.bfw.wiki/bfwrepo/image/6066911813b2f.png) no-repeat;background-size:cover;}
.about_content{width:60%;margin:0 auto;}
.about_content h2,.about_content h3{text-align:center;font-weight:bold;color:#000;}
.about_content h2{font-size:40px;margin-bottom:50px;}
.about_content p{font-size:16px;color:#000;line-height:180%;margin-bottom:20px;text-align:center;}
.about_content.history{text-align:center;position:relative;}

/*大事记start*/
.event_box{width:60%;margin:3% auto 0;position:relative;min-height:420px;}
.event_box .parHd {width:100%;display:inline-block;height:92px;overflow:hidden;}
.parHd  ul{width:100%;text-align:center;margin:0 auto;padding-top:25px !important;}
.parHd .tempWrap{margin:0 auto;}
.parHd .tempWrap:after{content:'';width:85%;height:1px;background:#580000;position:absolute;/* top:33%;*//* right:-140%;*/right:8%;top:35%;/* margin-top:-0.5px;*/z-index:10;}
.parHd li.no_line:before{display:none;}
.parHd li{display:inline-block;cursor:pointer;padding-top:30px;font-size:16px;color:#000;margin:0 30px;position:relative;}
.parHd li:after{content:'';background:url(//repo.bfw.wiki/bfwrepo/image/606690e06b104.png) no-repeat;width:24px;height:24px;position:absolute;z-index:20;top:-12px;left:50%;margin-left:-12px;}
.parBd{text-align:center;margin-top:60px;}
.parBd h4{position:relative;font-size:40px;margin-bottom:3%;/*width:200px;*/ padding:0 60px;display:inline-block;text-align:center;}
.parBd h4:after{content:'';background:#000;width:100px;height:1px;position:absolute;left:-100px;bottom:12px;}
.parBd h4:before{content:'';background:#000;width:100px;height:1px;position:absolute;right:-100px;bottom:12px;}
.parBd p{line-height:180%;font-size:16px;width:80%;margin:0 auto;}
div#listBox {width:100%;}
.sPrev,.sNext{width:30px;height:30px;display:block;position:absolute;top:10px;}
.sPrev{left:0;}
.sNext{right:0;}
.sPrev img,.sNext img{transition:all .6s cubic-bezier(.51,1.1,.9,.95);-moz-transition:all .6s cubic-bezier(.51,1.1,.9,.95);-webkit-transition:all .6s cubic-bezier(.51,1.1,.9,.95);-o-transition:all .6s cubic-bezier(.51,1.1,.9,.95);}
.parHd li.act span{display:block;width:24px;height:24px;overflow:hidden;background:url(../images/cat.png) no-repeat;position:absolute;top:-12px;left:28px;z-index:21;}
.parHd li span,.parHd li.clone span{display:none;}	
</style>
	<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.........完整代码请登录后点击上方下载按钮下载查看