提交 e6490c2d 作者: 刘贵生

first commit

上级
# company_web
#### 项目介绍
{**以下是码云平台说明,您可以替换为您的项目简介**
码云是开源中国推出的基于 Git 的代码托管平台(同时支持 SVN)。专为开发者提供稳定、高效、安全的云端软件开发协作平台
无论是个人、团队、或是企业,都能够用码云实现代码托管、项目管理、协作开发。企业项目请看 [https://gitee.com/enterprises](https://gitee.com/enterprises)}
#### 软件架构
软件架构说明
#### 安装教程
1. xxxx
2. xxxx
3. xxxx
#### 使用说明
1. xxxx
2. xxxx
3. xxxx
#### 参与贡献
1. Fork 本项目
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request
#### 码云特技
1. 使用 Readme\_XXX.md 来支持不同的语言,例如 Readme\_en.md, Readme\_zh.md
2. 码云官方博客 [blog.gitee.com](https://blog.gitee.com)
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解码云上的优秀开源项目
4. [GVP](https://gitee.com/gvp) 全称是码云最有价值开源项目,是码云综合评定出的优秀开源项目
5. 码云官方提供的使用手册 [http://git.mydoc.io/](http://git.mydoc.io/)
6. 码云封面人物是一档用来展示码云会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
@charset "utf-8";
/* 品牌加盟样式 */
/* 海报 */
#poster{
height:650px;
}
#poster .poster_banner{
width:100%;
height:100%;
background: url('../images/company_poster.png')
}
#poster .banner_left{
text-align: center;
}
#poster .banner_left p:first-of-type{
color:#000;
font-size: 46px;
margin-bottom:25px;
}
#poster .banner_left{
width:230px;
margin-left: 301px;
margin-top: 240px;
}
#poster .banner_left div{
width:229px;
height:64px;
border:1px solid #fff;
background: #12ab8c;
color:#fff;
line-height: 60px;
font-size: 26px;
border-radius: 5px;
cursor: pointer;
}
#poster .banner_left p:last-of-type{
margin-top:20px;
color:#333;
font-size: 11px;
letter-spacing:1px;
}
#poster .wechat img {
margin-top: 200px;
margin-left: 350px;
opacity: 0;
}
/* 二维码动画 */
@keyframes fadeInBig{
0%{
opacity: 0;
transform: scale(3.5) rotate(150deg);
}
50%{
margin-left: 30px;
transform: scale(0.3);
}
100%{
opacity: 1;
margin-left: 30px;
transform: scale(1);
}
}
/* 品牌介绍和加盟流程 */
#partner_body{
width:1048px;
margin: auto;
}
#partner_body .partner_listone{
margin:138px 0px 66px;
}
#partner_body .partner_listone li{
width:283px;
height:208px;
border:1px solid #e2e2e2;
}
#partner_body .partner_listone li:nth-child(2){
margin:0px 92px;
}
#partner_body .partner_listone i{
width:150px;
display: block;
text-align: center;
line-height: 100px;
color:#fff;
background: #12ab8c;
font-size:62px;
border-radius: 10px;
margin:-46px auto 0px;
}
#partner_body .partner_listone .introduce{
margin-top:33px;
line-height:31px;
}
#partner_body .partner_listone .introduce p {
font-size: 17px;
text-align: center;
}
#partner_body .partner_listone span{
font-size: 20px;
color:#12ab8c;
margin:0px 1px 2px;
font-weight: 600;
}
#partner_body .partner_btn{
width:213px;
height:48px;
margin:auto;
border-radius: 10px;
overflow: hidden;
}
#partner_body .partner_btn button{
display: block;
width:100%;
height:100%;
text-align: center;
color:white;
background: #12ab8c;
font-size: 24px;
border: 0;
}
.partner_list{
margin:57px 0px 76px;
}
.partner_list li{
width:50%;
height:247px;
float:left;
background: #12ab8c;
color:#fff;
text-align: left;
}
.partner_list li p{
font-size: 12px;
line-height: 20px;
}
.partner_list1 p{
margin-left:70px;
}
.partner_list2 p{
margin-left:130px;
}
.partner_list3 p{
margin-left:165px;
}
.partner_list li p:first-child{
font-size: 18px;
font-weight: 600;
}
.partner_list1 p:first-child{
margin-top:18px;
margin-bottom:14px;
line-height: 34px;
}
.partner_list2 p:first-child{
margin-top:14px;
margin-bottom:10px;
line-height: 32px;
}
.partner_list3 p:first-child{
margin-top:53px;
margin-bottom:14px;
line-height: 30px;
}
.partner_list1 p:first-child{
line-height: 34px;
}
.partner_list li p:last-child{
line-height:26px;
margin-top:5px;
}
.partner_list .list_img1{
background: url('../images/support_a.png')
}
.partner_list .list_img2{
background: url('../images/support_c.png')
}
.partner_list .list_img3{
background: url('../images/support_b.png')
}
.partner_line{
position: relative;
height:20px;
}
.login_content {
position: absolute;
min-width: 1048px;
}
.login_content div {
color:#858585;
font-size: 20px;
line-height: 20px;
margin-left: 485px;
}
.login_content div:after, .login_content div:before {
background: #ebebeb;
content: "";
height: 1px;
position: absolute;
top: 50%;
width: 42%;
}
/*调整背景横线的左右距离*/
.login_content div:before {
left: 0;
}
.login_content div:after {
right: 0;
}
/* 加盟流程 */
.partner_flow{
position: relative;
height:136px;
margin-top:82px;
}
.partner_flow p{
position: absolute;
top:13px;
left:50%;
margin-left:-380px;
width:760px;
height:2px;
border-bottom:1px dotted #cecdcd;
z-index: 999;
}
.partner_flow div{
position: absolute;
left:50%;
margin-left:-413px;
z-index: 1000;
}
.partner_flow .flow_number{
width:778px;
margin: auto;
}
.partner_flow li{
float:left;
}
.partner_flow .flow_number li{
width:28px;
line-height:28px;
text-align: center;
color:#fff;
background:#12ab8d;
margin-right:122px;
font-size: 18px;
border-radius: 50%;
}
.partner_flow ul li:last-of-type{
margin-right:0px;
}
.partner_flow .flow_text{
width:826px;
margin:20px auto 0px;
}
.partner_flow .flow_text li{
width:66px;
color:#5b5b5b;
margin-right:86px;
font-size: 16px;
}
/* 千家大地图 */
#qj_map .map {
margin-top: 60px;
width: 100%;
}
#qj_map .map img {
width: 100%;
}
/* 底部 */
footer {
height: 220px;
background-color: #17232c;
}
.fotter_logo {
width: 85px;
height: 85px;
margin: 0 auto;
}
.fotter_logo img {
margin: 56px auto;
}
footer .support {
font-size: 12px;
font-weight: 600;
color: #fff;
margin-left: 50%;
transform: translate(-65px);
margin-top: 80px;
}
\ No newline at end of file
@charset "utf-8";
/* 千家风采页样式 */
header {
height: 82px;
background-color: pink;
}
.first_video video {
object-fit: fill;
width: 100%;
}
/* 模块标题 */
#content2 {
margin-top:60px;
}
#content1 h1 {
font-size: 30px;
line-height: 28px;
padding-top: 60px;
text-align: center;
color: #192d3b;
}
#content1 span {
font-size: 12px;
color: #192d3b;
display: block;
line-height: 12px;
text-align: center;
letter-spacing: 1.5px;
}
#content1 h1:after {
content: "";
display: block;
width: 93px;
height: 2px;
margin: 28px auto;
border-bottom: 2px solid #24b298;
}
/* 视差背景1 */
#content2 {
height: 650px;
background: url(../images/team_bgc.png) no-repeat;
opacity: 0.65;
}
/* 视差内容1 */
#content3 .team {
background-color: #fff;
box-shadow: 0 0 20px rgb(228, 219, 219);
position: relative;
}
#content3 .team1{
margin-top: -300px;
}
/* 开头文字 */
#content3 .top_words{
position: absolute;
top:-15px;
left:0px;
letter-spacing: 2px;
}
#content3 .top_words span{
display: inline-block;
font-size: 30px;
line-height:30px;
color: #24b298;
word-spacing: 5px;
}
#content3 .top_words .left_words {
position: relative;
height:30px;
font-size: 30px;
line-height: 30px;
color: #464646;
padding-right:15px;
}
#content3 .top_words .one_word::after{
position: absolute;
top:0px;
left:0px;
content:'WE ARE THE';
display: block;
height:15px;
overflow: hidden;
font-size: 30px;
line-height: 30px;
word-spacing: 5px;
color:#fff;
}
/* 样式模板 丽景琴园团队 */
.team_msg {
margin-left: 107px;
}
/* 团队名称 */
.team_msg h1 {
font-size: 30px;
line-height: 30px;
color: #192d3b;
margin-top:142px;
}
/* 团队介绍 */
.team_msg .team_int{
position: relative;
margin: 40px 0px 0px 42px;
}
.team_msg p {
color: #545454;
font-weight: 600;
margin-top: 18px;
}
.team_int span {
position: relative;
display: block;
color: #545454;
margin-top: 18px;
}
.team_int span::before {
position: absolute;
top:0px;
left:-34px;
content: "";
width: 10px;
height: 10px;
display: inline-block;
background-color: #d4d4d4;
border-radius: 50%;
margin-top: 6px;
}
.team_msg .line {
position: absolute;
top:0px;
left:-30px;
width: 2px;
height: 100%;
padding-bottom:30px;
background-color: #d4d4d4;
}
.team1_video video {
object-fit: fill;
width: 700px;
height: 580px;
margin:14px;
}
/* 凤凰园团队 */
/* 团队名称 */
#content3 .team2 .top_words{
right:0px;
text-align: right;
}
#content3 .team2 .team_msg h1 {
margin-top:175px;
}
#content3 .team2 .team_msg {
margin-right: 107px;
text-align: right;
}
/* 团队介绍 */
#content3 .team2 .team_msg .team_int{
margin: 40px 42px 0px 0px;
}
#content3 .team2 .team_int span::before{
display: none;
}
#content3 .team2 .team_int span::after {
position: absolute;
top:0px;
right:-34px;
content: "";
width: 10px;
height: 10px;
display: inline-block;
background-color: #d4d4d4;
border-radius: 50%;
margin-top: 6px;
}
#content3 .team2 .team_msg .line {
left: 227px;
}
#content3 .team2,
#content3 .team3{
margin-top:135px;
}
/* 新一中团队 */
#content3 .team3 .top_words .left_words {
padding:0px 0px 0px 15px;
}
#content3 .team3 .team_msg h1 {
margin-top:190px;
}
/* 个人风采 */
#person_mien .mien_content{
margin-top:60px;
padding-bottom:30px;
}
#person_mien .person_box{
position: relative;
height:570px;
}
#person_mien .person_photo{
position: absolute;
bottom:0px;
left:0px;
}
#person_mien .person_photo li{
float:left;
margin-right:30px;
transition: all .5s ease;
cursor: pointer;
}
#person_mien .person_photo li img{
display: block;
}
#person_mien .person_photo .li_hover{
box-shadow: 0px 0px 20px #e2e6ec;
margin-top:-60px;
transform: scale(1.05)
}
#person_mien .person_photo li:last-of-type{
margin-right:0px;
}
#person_mien .person_content{
margin-top:60px;
}
#person_mien .team1_video video {
object-fit: fill;
width: 605px;
height: 405px;
margin:0px 200px 0px 0px;
}
#person_mien .personage{
display: none;
}
#person_mien .dongzuojin .team_msg h1 {
margin-top:115px;
}
#person_mien .team_msg h1 {
margin-top:60px;
}
#person_mien .team_msg {
margin-left: 0px;
}
#person_mien .preson_store{
font-size: 16px;
line-height:16px;
}
.team_int span {
margin-top: 10px;
}
/* 视差背景图2 */
#content4 {
height: 655px;
background-image:url(../images/school_bgc.png);
background-position-y: 500px;
opacity: 0.65;
margin-top:90px;
}
/* 视差内容2 */
#content5{
position: relative;
height:215px;
padding-bottom:30px;
}
#content5 .main_body{
position: absolute;
box-shadow: 0px 0px 20px #918b8b;
top:-475px;
left:50%;
margin-left:-600px;
}
#content5 .main_body video{
display: block;
object-fit: fill;
width: 1200px;
height: 690px;
margin:0px 200px 0px 0px;
}
/* 精彩短片 */
#video_banner .box_show{
position: relative;
width:100%;
height:306px;
margin-top:86px;
overflow: hidden;
}
#video_banner .box_show .video_box{
position: absolute;
top:0px;
left:0px;
width:154.34%;
}
#video_banner .box_show li{
width:438px;
height:100%;
margin-right:25px;
float:left;
}
#video_banner .box_show li video{
display: block;
width:100%;
height:100%;
}
@charset "utf-8";
/* 页面初始化文件 */
/** 清除内外边距 **/
* {
margin: 0;
padding: 0;
}
/* structural elements 结构元素 */
body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
/* list elements 列表元素 */
dl,
dt,
dd,
ul,
ol,
li,
/* text formatting elements 文本格式元素 */
pre,
/* form elements 表单元素 */
form,
fieldset,
legend,
button,
input,
textarea,
/** 设置默认字体 **/
body,
button,
input,
select,
textarea {
font: 14px/1.5 tahoma, \5FAE\8F6F\96C5\9ED1, 'Microsoft Regular';
}
/* 将斜体扶正 */
/* address,
cite,
dfn,
em,
var {
font-style: normal;
} */
/* 小于 12px 的中文很难阅读, 让 small 正常化 */
/*
small {
font-size: 12px;
} */
/** 重置列表元素 **/
ul,
ol,
li {
list-style: none;
}
/** 重置文本格式元素 **/
a {
text-decoration: none;
outline: none;
}
a:focus {
outline: none;
}
a:hover {
text-decoration: underline;
}
sup {
vertical-align: text-top;
}
/* 重置, 减少对行高的影响 */
sub {
vertical-align: text-bottom;
}
/** 重置表单元素 **/
legend {
color: #000;
}
/* for ie6 */
fieldset,
img {
border: 0;
}
/* img 搭车:让链接里的 img 无边框 */
button,
input,
select,
textarea {
font-size: 100%;
}
/* 使得表单元素在 ie 下能继承字体大小 */
/* 注:optgroup 无法扶正 */
/** 重置表格元素 **/
table {
border-collapse: collapse;
border-spacing: 0;
}
/* 重置 HTML5 元素 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
display: block;
margin: 0;
padding: 0;
}
mark {
background: #ff0;
}
/*input的自带样式*/
input {
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
appearance: none;
outline: none;
}
input:focus {
outline: none;
}
/* 更改a标签默认样式 */
/* 浮动 */
.left {
float: left;
}
.right {
float: right;
}
/* 清除浮动 */
.clear:after {
display: block;
clear: both;
content: "";
visibility: hidden;
height: 0
}
.clear {
zoom: 1
}
/* 主体 */
.main_body {
width: 1200px;
height:100%;
margin: 0 auto;
}
/* 页面最小宽度 解决了窗口缩小 滑动滚动条没有背景得问题 */
body {
min-width: 1200px;
}
/* 去掉文本域下角标 */
textarea {
resize: none;
}
/* 去掉button元素外边框和边框*/
button {
outline: none;
}
/* 字体文件 */
@font-face{
font-family: 'DIN Black';
src: url('../font/DIN-Black.otf')
}
@font-face{
font-family: 'calibril';
src: url('../font/calibril.ttf')
}
/* @font-face{
font-family: 'DIN Black';
src: url('../font/DIN-Black.otf')
} */
\ No newline at end of file
*{margin: 0;padding: 0;list-style: none;}
/*
KISSY CSS Reset
理念:1. reset 的目的不是清除浏览器的默认样式,这仅是部分工作。清除和重置是紧密不可分的。
2. reset 的目的不是让默认样式在所有浏览器下一致,而是减少默认样式有可能带来的问题。
3. reset 期望提供一套普适通用的基础样式。但没有银弹,推荐根据具体需求,裁剪和修改后再使用。
特色:1. 适应中文;2. 基于最新主流浏览器。
维护:玉伯<lifesinger@gmail.com>, 正淳<ragecarrier@gmail.com>
*/
/** 清除内外边距 **/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */ {
margin: 0;
padding: 0;
}
/** 设置默认字体 **/
body,
button, input, select, textarea /* for ie */ {
font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif;
}
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
small { font-size: 12px; } /* 小于 12px 的中文很难阅读,让 small 正常化 */
/** 重置列表元素 **/
ul, ol { list-style: none; }
/** 重置文本格式元素 **/
a { text-decoration: none; }
a:hover { text-decoration: underline; }
/** 重置表单元素 **/
legend { color: #000; } /* for ie6 */
fieldset, img { border: 0; } /* img 搭车:让链接里的 img 无边框 */
button, input, select, textarea { font-size: 100%; } /* 使得表单元素在 ie 下能继承字体大小 */
/* 注:optgroup 无法扶正 */
/** 重置表格元素 **/
table { border-collapse: collapse; border-spacing: 0; }
/* 清除浮动 */
.ks-clear:after, .clear:after {
content: '\20';
display: block;
height: 0;
clear: both;
}
.ks-clear, .clear {
*zoom: 1;
}
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main h1{font-size:36px; color:#333; text-align:left;margin-bottom:30px; border-bottom: 1px solid #eee;}
.helps{margin-top:40px;}
.helps pre{
padding:20px;
margin:10px 0;
border:solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists{
width: 100% !important;
}
.icon_lists li{
float:left;
width: 100px;
height:180px;
text-align: center;
list-style: none !important;
}
.icon_lists .icon{
font-size: 42px;
line-height: 100px;
margin: 10px 0;
color:#333;
-webkit-transition: font-size 0.25s ease-out 0s;
-moz-transition: font-size 0.25s ease-out 0s;
transition: font-size 0.25s ease-out 0s;
}
.icon_lists .icon:hover{
font-size: 100px;
}
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p,
.markdown pre {
margin: 1em 0;
}
.markdown > p,
.markdown > blockquote,
.markdown > .highlight,
.markdown > ol,
.markdown > ul {
width: 80%;
}
.markdown ul > li {
list-style: circle;
}
.markdown > ul li,
.markdown blockquote ul > li {
margin-left: 20px;
padding-left: 4px;
}
.markdown > ul li p,
.markdown > ol li p {
margin: 0.6em 0;
}
.markdown ol > li {
list-style: decimal;
}
.markdown > ol li,
.markdown blockquote ol > li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown pre {
border-radius: 6px;
background: #f7f7f7;
padding: 20px;
}
.markdown pre code {
border: none;
background: #f7f7f7;
margin: 0;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown > table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown > table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown > table th,
.markdown > table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown > table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
font-style: italic;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown > br,
.markdown > p > br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
pre{
background: #fff;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>品牌加盟</title>
<link rel="stylesheet" href="./css/reset.css">
<link rel="stylesheet" href="./css/index.css">
<link rel="stylesheet" href="./iconfont/iconfont.css">
<link rel="stylesheet" href="./css/join_us.css">
<script src="./js/join_us.js"></script>
</head>
<body>
<!-- 固定导航 -->
<div id="top_nav" class="header_scroll">
<div class="main_body clear">
<a class="logo left" href="./index.html#top">
<img src="./images/brand_first.png" alt="" class="left">
<p class="left">千家地产</p>
</a>
<div class="nav right">
<a class="nav_first" href="./index.html#top">首页</a>
<a href="#to_company">公司介绍</a>
<a href="#to_department">招贤纳士</a>
<a href="#to_cours">发展历程</a>
<a href="#to_product">产品服务</a>
<a href="./join_us.html" class="choosed">品牌加盟</a>
<a class="nav_last" href="qj_show.html">千家风采</a>
</div>
</div>
</div>
<!-- 海报 -->
<div id="poster">
<div class="poster_banner">
<div class="main clear">
<div class="banner_left left">
<div id="order">预约面试</div>
</div>
<div class="wechat">
<img id="code_img" src="./images/office_accounts.jpg" alt="">
</div>
</div>
</div>
</div>
<!-- 品牌介绍和加盟流程 -->
<div id="partner_body">
<ul class="partner_listone clear">
<li class="left">
<i class="iconfont icon-rcfz"></i>
<div class="introduce">
<p>现有门店<span>2000</span>位专业经纪</p>
<p>人,拥有国家经纪人资格证<br/></p>
<p><span>223</span>人,协理<span>300</span></p>
</div>
</li>
<li class="left">
<i class="iconfont icon-share"></i>
<div class="introduce">
<p>共享千家地产资源</p>
<p>现有房源<span>8</span></p>
<p>客源<span>7</span></p>
</div>
</li>
<li class="left">
<i class="iconfont icon-renminbi3"></i>
<div class="introduce">
<p><span></span>加盟费,仅收取平台</p>
<p>运营费<span>800</span>元/月</p>
</div>
</li>
</ul>
<ul class="partner_list clear">
<li class="list_img1"></li>
<li class="partner_list1">
<p>千家品牌名片支撑:</p>
<p>
①十四年名企。(2004年-2018年)<br/>
②河北省唯一一家商务部备案房地产企业。<br/>
③唐山百万家庭放心置业首选。客户认可度高,老百姓认可企业<br/>
④权威部门数据采集企业。<br/>
⑤电视台专访企业。<br/>
公司每年广告宣传支持费用<span>200余万</span>
</p>
</li>
<li class="partner_list2">
<p>千家系统支持:</p>
<p>
<span>免费</span>千家商学院,数百套名师授课精品视频。<br/>
一线名企顾问讲师定期培训。<br/>
行业公开课,分享行业内的最新资讯。<br/>
公司年会,提供学习分享观摩交流平台<br/>
季度启动会,优秀员工、团队表彰。<br/>
周店长培训会。<br/>
新员工入司培训。
</p>
</li>
<li class="list_img2"></li>
<li class="list_img3"></li>
<li class="partner_list3">
<p>权证支持:</p>
<p>
20余家银行信贷协议合作单位<br/>
一站式服务制定最佳信贷组合方案<br/>
优质的员工培养平台<br/>
合同文书、法律顾问<br/>
</p>
</li>
</ul>
<div class="partner_line">
<div class="login_content">
<div>加盟流程</div>
</div>
</div>
<div class="partner_flow">
<p></p>
<div>
<ul class="flow_number clear">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
<ul class="flow_text clear">
<li>意向咨询</li>
<li>洽谈指导</li>
<li>店址考察</li>
<li>签署协议</li>
<li>运营准备</li>
<li>门店营业</li>
</ul>
</div>
</div>
</div>
<!-- 千家大地图 -->
<a id="to_map" name="to_map"></a>
<div id="qj_map">
<div class="model_top">
<div class="model_title">千家大地图</div>
<p class="model_eng">MAP</p>
</div>
<div class="map">
<img src="./images/map.jpg" alt="">
</div>
</div>
<!-- 底部 -->
<footer>
<div class="fotter_logo">
<img src="./images/white_logo.png" alt="">
</div>
<div class="support">千家网络科技提供技术</div>
</footer>
</body>
</html>
\ No newline at end of file
window.onload = function(){
// 刷新回到顶部
// setTimeout(() => window.scrollTo(0,0), 14)
// 鼠标滑动显示对应hash
function mouse_scroll( now_dom , now_hash ,last_dom){
var _dom = document.getElementById(now_dom);
var __dom= document.getElementById(last_dom);
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop
let clientHeight = document.documentElement.clientHeight || document.body.clientHeight
let height = _dom.offsetTop - scrollTop
if (scrollTop > _dom.offsetTop && scrollTop < __dom.offsetTop){
window.location.hash = now_hash
}
}
// 导航点击
var nav = document.getElementsByClassName("nav")[0];
var click_a = nav.getElementsByTagName("a");
for(let i = 0 ; i < click_a.length ; i++){
click_a[i].index = i;
click_a[i].onclick = function(){
for(let a = 0 ; a < click_a.length ; a++){
click_a[a].classList.remove("choosed")
}
click_a[this.index].classList.add("choosed")
}
}
// 固定导航的显示隐藏
var scroll = function(){
let nav_height = document.getElementById("top_nav")
let scrollTop = document.body.scrollTop || document.documentElement.scrollTop
if(scrollTop > 0){
nav_height.classList.add('header_scroll')
}else{
nav_height.classList.remove('header_scroll')
window.location.hash="#top"
}
}
scroll()
window.onscroll = function(){
scroll()
}
// window.onscroll = function(){
// // 滚动条滚动 导航样式
// let nav = document.getElementsByClassName("nav")[0];
// let click_a = nav.getElementsByTagName("a");
// for(let i = 0 ; i < click_a.length ; i++){
// click_a[i].classList.remove("choosed")
// switch(window.location.hash){
// case '#top':
// click_a[0].classList.add("choosed")
// break;
// case '#to_company':
// click_a[1].classList.add("choosed")
// break;
// case '#to_department':
// click_a[2].classList.add("choosed")
// break;
// case '#to_cours':
// click_a[3].classList.add("choosed")
// break;
// case '#to_product':
// click_a[4].classList.add("choosed")
// break;
// }
// }
// scroll()
// switch(window.location.hash){
// case '#top':
// mouse_scroll('introduce','#to_company','department')
// break;
// case '#to_company':
// mouse_scroll('department','#to_department','cours')
// break;
// case '#to_department':
// mouse_scroll('cours','#to_cours','product_service')
// break;
// case '#to_cours':
// mouse_scroll('product_service','#to_product','footer')
// break;
// }
// }
// 侧边二维码
var qr_code = document.getElementsByClassName("qr_code")[0];
var code_img = this.document.getElementsByClassName("code_img")[0];
qr_code.onmouseover = function () {
code_img.style.opacity = 1;
code_img.style.animation = "rightLeft .8s ease-in-out forwards"
}
qr_code.onmouseout = function () {
code_img.style.opacity = 0;
code_img.style.animation = ""
}
// 返回顶部
var go_top = document.getElementsByClassName("go_top")[0];
go_top.onclick = function backTop () {
clearInterval(timer);
var timer = setInterval(function() {
let scrollHeight = document.documentElement.scrollTop || document.body.scrollTop;
let now = scrollHeight;
let speed = (2 - now) / 15;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
if (scrollHeight === 0) {
clearInterval(timer);
}
document.documentElement.scrollTop = scrollHeight + speed;
document.body.scrollTop = scrollHeight + speed;
}, 14);
window.onmousewheel = function(){
clearInterval(timer);
}
go_top.onmouseout = function(){
clearInterval(timer)
}
}
// 公司介绍品牌切换
// var first = document.getElementsByClassName("first_introduce")[0];
// var second = document.getElementsByClassName("second_introduce")[0];
// second.onclick = function () {
// this.style.right = "30px";
// this.style.animation = "smallBig .6s ease forwards";
// this.style.zIndex = "5";
// first.style.left = "-30px";
// first.style.zIndex = "4";
// first.style.animation = "bigSmall .6s ease forwards";
// }
// first.onclick = function () {
// this.style.left = 0;
// this.style.animation = "toInit2 .6s ease forwards";
// this.style.zIndex = "5";
// second.style.right = 0;
// second.style.zIndex = "4";
// second.style.animation = "toInit .6s ease forwards";
// }
}
\ No newline at end of file
window.onload = function () {
// 点击预约面试按钮显示二维码
var order = document.getElementById("order");
var img = document.getElementById("code_img");
order.onclick = function () {
img.style.animation = "fadeInBig 2s .1s ease-in-out forwards"
}
}
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
window.onload = function () {
// 公司宣传视频
var company_video = document.getElementById("company_video")
// company_video.style.width = window.screen.width + "px";
company_video.style.height = window.screen.height - 170 + "px";
// 视差滚动
$.stellar({
horizontalScrolling: false,
responsive: true
});
var photo = document.getElementById("person_photo");
var photo_single = photo.getElementsByTagName("li")
var content_single = document.getElementsByClassName("personage")
for(var i = 0;i < photo_single.length ; i++){
photo_single[i].index = i;
photo_single[i].onmouseover = function(){
for(var a = 0; a < photo_single.length ; a++){
photo_single[a].classList.remove("li_hover")
content_single[a].style.display="none";
}
photo_single[this.index].classList.add("li_hover")
content_single[this.index].style.display = "block";
}
}
// 视频轮播
var video_banner = document.getElementById("video_banner");
var video_box = video_banner.getElementsByClassName("video_box")[0]
var video_single = video_banner.getElementsByTagName("li");
var timer=null;
var speed=-2;
video_box.innerHTML+=video_box.innerHTML;
video_box.style.width=(video_single[0].offsetWidth+25)*video_single.length+"px"
function autoPlay(){
timer=setInterval(function(){
video_box.style.left=video_box.offsetLeft+speed+"px";
if(video_box.offsetLeft<-video_box.offsetWidth/2){
video_box.style.left="0px";
}else if(video_box.offsetLeft>0){
video_box.style.left=-video_box.offsetWidth/2+"px";
}
},14);
}
autoPlay();
video_banner.onmouseover=function(){
clearInterval(timer);
};
video_banner.onmouseout=function(){
autoPlay();
}
}
\ No newline at end of file
window.onload = function(){
var oBtn = document.getElementById("footer");
var timer;
var isCom = false; //定义一个变量
oBtn.onclick = function () {
timer = setInterval(function () {
isCom = true;
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
var speed = Math.ceil(scrollTop / 10); //scrollTop 的数值越来越大 所以speed发也越来越大 速度越到上面越慢
document.documentElement.scrollTop -= speed;
document.body.scrollTop -= speed;
if (scrollTop <= 0) {
clearInterval(timer);
}
}, 20)
}
window.onscroll = function () {
if (!isCom) {
clearInterval(timer)
} else {
isCom = false;
}
}
}
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- <link href="https://vjs.zencdn.net/7.0.3/video-js.css" rel="stylesheet"> -->
<!-- <script src="http://vjs.zencdn.net/ie8/ie8-version/videojs-ie8.min.js"></script> -->
<!-- <script src="https://vjs.zencdn.net/7.0.3/video.js"></script> -->
<link rel="stylesheet" href="./css//bootstrap.min.css">
<script src="./js/jquery-3.3.1.slim.min.js"></script>
<script src="./js/popper.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
</head>
<style>
* {
margin: 0;
padding: 0;
}
video {
object-fit: fill;
/* margin-left: 50%;
transform: translate(-600px);
margin-top: 20px; */
}
h1 {
margin-left: 50%;
transform: translate(-65px);
color: rgb(107, 89, 89);
}
</style>
<body>
<!-- <h1>千家风采</h1> -->
<video id="video" src="/home/liu/c_企业站/企业站视频素材/2018千家宣传片.mp4" autoplay preload="preload" controls="controls"></video>
<!-- <video id="my-video" class="video-js" controls preload="auto" width="1000px"
poster="MY_VIDEO_POSTER.jpg" data-setup="{}">
<source src="./第一高峰.mp4">
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video> -->
<div id="carouselExampleIndicators" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src="./images/banner1.jpg" alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="./images/banner2.jpg" alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="./images/banner3.jpg" alt="Third slide">
</div>
</div>
</div>
</body>
<script>
var video = document.getElementById("video")
video.style.width = document.body.clientWidth + "px";
video.style.height = document.body.clientHeight + "px"
console.log(document.body.clientWidth)
console.log(document.body.clientHeight)
$('.carousel').carousel({
interval: 3000,
pause: false
})
</script>
</html>
\ No newline at end of file
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论