Skip to content

T
test
提交 6271dc4f 作者: 武宏岩
操作

优化地图，支持，视频，体系

上级 a82ca59e
正在显示 包含 72 行增加 和 60 行删除
about.html
......@@ -316,21 +316,21 @@
<span>SHORT FILM</span>
</div>
<div class="box_show">
<ul class="video_box clear">
<ul class="video_box clear" id="videoBox">
<li>
<video src="https://qjvideo.oss-cn-beijing.aliyuncs.com/1.%E9%BA%BB%E9%9B%80%20%E6%9C%80%E7%BB%88%E9%85%8D%E9%9F%B3%E7%89%88_x264.mp4"
<video class="video_one" src="https://qjvideo.oss-cn-beijing.aliyuncs.com/1.%E9%BA%BB%E9%9B%80%20%E6%9C%80%E7%BB%88%E9%85%8D%E9%9F%B3%E7%89%88_x264.mp4"
poster="./images/short_cut2.jpg" controls></video>
</li>
<li>
<video src="https://qjvideo.oss-cn-beijing.aliyuncs.com/%E5%9B%9E%E5%AE%B6%E6%8E%A2%E4%BA%B2_x264.mp4" poster="./images/short_cut4.jpg"
<video class="video_two" src="https://qjvideo.oss-cn-beijing.aliyuncs.com/%E5%9B%9E%E5%AE%B6%E6%8E%A2%E4%BA%B2_x264.mp4" poster="./images/short_cut4.jpg"
controls></video>
</li>
<li>
<video src="https://qjvideo.oss-cn-beijing.aliyuncs.com/%E7%AC%AC%E4%B8%80%E9%AB%98%E5%B3%B0.mp4" poster="./images/short_cut1.jpg"
<video class="video_there" src="https://qjvideo.oss-cn-beijing.aliyuncs.com/%E7%AC%AC%E4%B8%80%E9%AB%98%E5%B3%B0.mp4" poster="./images/short_cut1.jpg"
controls></video>
</li>
<li>
<video src="https://qjvideo.oss-cn-beijing.aliyuncs.com/4.%E4%BA%BA%E6%9C%89%E5%85%B6%E5%B1%85.mp4" poster="./images/short_cut3.jpg"
<video class="video_four" src="https://qjvideo.oss-cn-beijing.aliyuncs.com/4.%E4%BA%BA%E6%9C%89%E5%85%B6%E5%B1%85.mp4" poster="./images/short_cut3.jpg"
controls></video>
</li>
</ul>
......
css/contactus.css
......@@ -364,58 +364,60 @@
#test1 ul li:nth-of-type(1){
width: 536px;
background: url(../images/a1.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul .firsted:nth-of-type(1){
width: 536px;
background: url(../images/a.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul li:nth-of-type(2){
background: url(../images/b1.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul .firsted:nth-of-type(2){
background: url(../images/b.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul li:nth-of-type(3){
background: url(../images/c1.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul .firsted:nth-of-type(3){
background: url(../images/c.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul li:nth-of-type(4){
background: url(../images/d1.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul .firsted:nth-of-type(4){
background: url(../images/d.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul li:nth-of-type(5){
background: url(../images/e1.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul .firsted:nth-of-type(5){
background: url(../images/e.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul li:nth-of-type(6){
background: url(../images/f1.png) no-repeat;
transition:width 0.6s;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 ul .firsted:nth-of-type(6){
background: url(../images/f.png) no-repeat;
transition:width 0.6s ;
transition: background 0.4s ease-in,width 0.6s;
}
#test1 .on .shadow{
#test1 .on .shadow:nth-of-type(1){
background: rgba(0,0,0,0.5);
width: 100%;
height: 100%;
position: relative;
transition: all linear 500ms;
}
#test1 .on .shadow p{
color: #fff;
......
js/about.js
......@@ -68,9 +68,16 @@ window.onload = function () {
},14);
}
autoPlay();
$("#videoBox li").bind("click","vodio",function(){
this.getElementsByTagName("video")[0].play();
$(this).siblings("li").each(function(i,el){
el.children[0].pause();
clearInterval(timer);
})
})
video_box.onmouseover=function(){
clearInterval(timer);
};
};
video_box.onmouseout=function(){
autoPlay();
}
......
js/commons.js
......@@ -21,11 +21,13 @@ window.onscroll=function(){
aaa = false;
}
}
// 地图的坐标
if(topScroll >= 3900){
setTimeout(function(){
var sha=document.getElementsByClassName("shadowd")[0];
console.log(sha)
var map=document.getElementsByClassName("maps")[0];
map.classList.add("add");
sha.classList.add("sha");
},1000);
}
}
\ No newline at end of file
js/index.js
......@@ -73,179 +73,179 @@ window.onload = function () {
//这里是数组，若是对象格式仅为循环方式不同而已
var json = [{
"resname": "人力资本部",
"img": "./images/Human.png",
"img": "./images/Human.jpg",
"resint": "千家的猎头组织。一个明明可以靠颜值，却硬是靠才华吃饭的部门，为社会创造更多的高端就业机会。我们为行业募选最优秀的精英，只寻找最真的你。"
}, {
"resname": "置业部",
"img": "./images/region.png",
"img": "./images/region.jpg",
"resint": "一群用青春去捍卫梦想的房地产经纪人，一个将屌丝变富帅的神奇部门。我们由一个职场小白，磨练成一个顶尖精英、蜕变成一个团队领导人，年入百万只需5年。我们持续壮大队伍，遍布全国，作为客户最坚实的后盾，我们在行业中循演着鲇鱼效应，推动着整个行业规范前行。"
},
{
"resname": "行政部（风险稽核部）",
"img": "./images/Administration.png",
"img": "./images/Administration.jpg",
"resint": "公司的大管家。用巨大的爱，做细小的事。规矩是我们的准绳，内秀的我们是企业战略执行的守护者，是业务部门的重要合作伙伴"
},
{
"resname": "培训中心",
"img": "./images/Train.png",
"img": "./images/Train.jpg",
"resint": " 博学、书香是我们的名片，美貌、俊朗是我们的标签。我们是灵魂导师，成功路上的引路人， 我们是千家教师天团，精英孵化中心的缔造者。"
}, {
"resname": "权证部",
"img": "./images/warrant.png",
"img": "./images/warrant.jpg",
"resint": "后期保障专家。15年专业团队,严谨的作风，顾问式的服务，用品质让客户安心，拥有一站式网落签约资格，让每一笔贷款安全无忧，让交易更简单，让家更温暖。"
}, {
"resname": "法务部",
"img": "./images/Legal.png",
"img": "./images/Legal.jpg",
"resint": "公司最权威的发言者。刚健中正的我们以法律的视角规避交易风险，捍卫权益者应有的合法利益。我们字字珠玑，锱铢必较，我们一直在竭力完善安全交易防火墙。"
},
{
"resname": "财务部",
"img": "./images/Finance.png",
"img": "./images/Finance.jpg",
"resint": "我们是管钱的。我们正直，沉稳而充满活力。财务管理分析是我们的爱好，我们对数字迷恋万分，资深财务导师指导我们严谨的打理公司财务，我们的身份就是财务大管家。"
},
{
"resname": "宣传部",
"img": "./images/Propaganda.png",
"img": "./images/Propaganda.jpg",
"resint": " 一帮充满梦想，搞创作的文艺青年。这里，有趣的灵魂，好看的皮囊，我们都有。优秀的我们，为千家文化的发扬光大，为行业的正名而沉醉。"
}, {
"resname": "科技研发部",
"img": "./images/network.png",
"img": "./images/network.jpg",
"resint": "在这里有一群热爱技术、乐于创造的 GEEK（对电脑痴迷的人）！哼着小曲敲代码，喝着咖啡 DEBUG(排除程序故障)，热爱千家MIS·至哲研发，偶尔写写微信小程序，一言不合自己搭服务器跑算法。最先进的互联技术，最一流的研发和测试设备，用科技解放生产力，让你的创意变成现实！"
}, {
"resname": "市场部",
"img": "./images/market.png",
"img": "./images/market.jpg",
"resint": "资源整合专家。我们洞察市场风云变化，拓展市场新资源，我们还致力于通过规范业务行为，引领行业服务品质新高度，我们是行业前行的探路者."
},{
"resname": "人力资本部",
"img": "./images/Human.png",
"img": "./images/Human.jpg",
"resint": "千家的猎头组织。一个明明可以靠颜值，却硬是靠才华吃饭的部门，为社会创造更多的高端就业机会。我们为行业募选最优秀的精英，只寻找最真的你。"
}, {
"resname": "置业部",
"img": "./images/region.png",
"img": "./images/region.jpg",
"resint": "一群用青春去捍卫梦想的房地产经纪人，一个将屌丝变富帅的神奇部门。我们由一个职场小白，磨练成一个顶尖精英、蜕变成一个团队领导人，年入百万只需5年。我们持续壮大队伍，遍布全国，作为客户最坚实的后盾，我们在行业中循演着鲇鱼效应，推动着整个行业规范前行。"
},
{
"resname": "行政部（风险稽核部）",
"img": "./images/Administration.png",
"img": "./images/Administration.jpg",
"resint": "公司的大管家。用巨大的爱，做细小的事。规矩是我们的准绳，内秀的我们是企业战略执行的守护者，是业务部门的重要合作伙伴"
},
{
"resname": "培训中心",
"img": "./images/Train.png",
"img": "./images/Train.jpg",
"resint": " 博学、书香是我们的名片，美貌、俊朗是我们的标签。我们是灵魂导师，成功路上的引路人， 我们是千家教师天团，精英孵化中心的缔造者。"
}, {
"resname": "权证部",
"img": "./images/warrant.png",
"img": "./images/warrant.jpg",
"resint": "后期保障专家。15年专业团队,严谨的作风，顾问式的服务，用品质让客户安心，拥有一站式网落签约资格，让每一笔贷款安全无忧，让交易更简单，让家更温暖。"
}, {
"resname": "法务部",
"img": "./images/Legal.png",
"img": "./images/Legal.jpg",
"resint": "公司最权威的发言者。刚健中正的我们以法律的视角规避交易风险，捍卫权益者应有的合法利益。我们字字珠玑，锱铢必较，我们一直在竭力完善安全交易防火墙。"
},
{
"resname": "财务部",
"img": "./images/Finance.png",
"img": "./images/Finance.jpg",
"resint": "我们是管钱的。我们正直，沉稳而充满活力。财务管理分析是我们的爱好，我们对数字迷恋万分，资深财务导师指导我们严谨的打理公司财务，我们的身份就是财务大管家。"
},
{
"resname": "宣传部",
"img": "./images/Propaganda.png",
"img": "./images/Propaganda.jpg",
"resint": " 一帮充满梦想，搞创作的文艺青年。这里，有趣的灵魂，好看的皮囊，我们都有。优秀的我们，为千家文化的发扬光大，为行业的正名而沉醉。"
}, {
"resname": "科技研发部",
"img": "./images/network.png",
"img": "./images/network.jpg",
"resint": "在这里有一群热爱技术、乐于创造的 GEEK（对电脑痴迷的人）！哼着小曲敲代码，喝着咖啡 DEBUG(排除程序故障)，热爱千家MIS·至哲研发，偶尔写写微信小程序，一言不合自己搭服务器跑算法。最先进的互联技术，最一流的研发和测试设备，用科技解放生产力，让你的创意变成现实！"
}, {
"resname": "市场部",
"img": "./images/market.png",
"img": "./images/market.jpg",
"resint": "资源整合专家。我们洞察市场风云变化，拓展市场新资源，我们还致力于通过规范业务行为，引领行业服务品质新高度，我们是行业前行的探路者."
},{
"resname": "人力资本部",
"img": "./images/Human.png",
"img": "./images/Human.jpg",
"resint": "千家的猎头组织。一个明明可以靠颜值，却硬是靠才华吃饭的部门，为社会创造更多的高端就业机会。我们为行业募选最优秀的精英，只寻找最真的你。"
}, {
"resname": "置业部",
"img": "./images/region.png",
"img": "./images/region.jpg",
"resint": "一群用青春去捍卫梦想的房地产经纪人，一个将屌丝变富帅的神奇部门。我们由一个职场小白，磨练成一个顶尖精英、蜕变成一个团队领导人，年入百万只需5年。我们持续壮大队伍，遍布全国，作为客户最坚实的后盾，我们在行业中循演着鲇鱼效应，推动着整个行业规范前行。"
},
{
"resname": "行政部（风险稽核部）",
"img": "./images/Administration.png",
"img": "./images/Administration.jpg",
"resint": "公司的大管家。用巨大的爱，做细小的事。规矩是我们的准绳，内秀的我们是企业战略执行的守护者，是业务部门的重要合作伙伴"
},
{
"resname": "培训中心",
"img": "./images/Train.png",
"img": "./images/Train.jpg",
"resint": " 博学、书香是我们的名片，美貌、俊朗是我们的标签。我们是灵魂导师，成功路上的引路人， 我们是千家教师天团，精英孵化中心的缔造者。"
}, {
"resname": "权证部",
"img": "./images/warrant.png",
"img": "./images/warrant.jpg",
"resint": "后期保障专家。15年专业团队,严谨的作风，顾问式的服务，用品质让客户安心，拥有一站式网落签约资格，让每一笔贷款安全无忧，让交易更简单，让家更温暖。"
}, {
"resname": "法务部",
"img": "./images/Legal.png",
"img": "./images/Legal.jpg",
"resint": "公司最权威的发言者。刚健中正的我们以法律的视角规避交易风险，捍卫权益者应有的合法利益。我们字字珠玑，锱铢必较，我们一直在竭力完善安全交易防火墙。"
},
{
"resname": "财务部",
"img": "./images/Finance.png",
"img": "./images/Finance.jpg",
"resint": "我们是管钱的。我们正直，沉稳而充满活力。财务管理分析是我们的爱好，我们对数字迷恋万分，资深财务导师指导我们严谨的打理公司财务，我们的身份就是财务大管家。"
},
{
"resname": "宣传部",
"img": "./images/Propaganda.png",
"img": "./images/Propaganda.jpg",
"resint": " 一帮充满梦想，搞创作的文艺青年。这里，有趣的灵魂，好看的皮囊，我们都有。优秀的我们，为千家文化的发扬光大，为行业的正名而沉醉。"
}, {
"resname": "科技研发部",
"img": "./images/network.png",
"img": "./images/network.jpg",
"resint": "在这里有一群热爱技术、乐于创造的 GEEK（对电脑痴迷的人）！哼着小曲敲代码，喝着咖啡 DEBUG(排除程序故障)，热爱千家MIS·至哲研发，偶尔写写微信小程序，一言不合自己搭服务器跑算法。最先进的互联技术，最一流的研发和测试设备，用科技解放生产力，让你的创意变成现实！"
}, {
"resname": "市场部",
"img": "./images/market.png",
"img": "./images/market.jpg",
"resint": "资源整合专家。我们洞察市场风云变化，拓展市场新资源，我们还致力于通过规范业务行为，引领行业服务品质新高度，我们是行业前行的探路者."
},{
"resname": "人力资本部",
"img": "./images/Human.png",
"img": "./images/Human.jpg",
"resint": "千家的猎头组织。一个明明可以靠颜值，却硬是靠才华吃饭的部门，为社会创造更多的高端就业机会。我们为行业募选最优秀的精英，只寻找最真的你。"
}, {
"resname": "置业部",
"img": "./images/region.png",
"img": "./images/region.jpg",
"resint": "一群用青春去捍卫梦想的房地产经纪人，一个将屌丝变富帅的神奇部门。我们由一个职场小白，磨练成一个顶尖精英、蜕变成一个团队领导人，年入百万只需5年。我们持续壮大队伍，遍布全国，作为客户最坚实的后盾，我们在行业中循演着鲇鱼效应，推动着整个行业规范前行。"
},
{
"resname": "行政部（风险稽核部）",
"img": "./images/Administration.png",
"img": "./images/Administration.jpg",
"resint": "公司的大管家。用巨大的爱，做细小的事。规矩是我们的准绳，内秀的我们是企业战略执行的守护者，是业务部门的重要合作伙伴"
},
{
"resname": "培训中心",
"img": "./images/Train.png",
"img": "./images/Train.jpg",
"resint": " 博学、书香是我们的名片，美貌、俊朗是我们的标签。我们是灵魂导师，成功路上的引路人， 我们是千家教师天团，精英孵化中心的缔造者。"
}, {
"resname": "权证部",
"img": "./images/warrant.png",
"img": "./images/warrant.jpg",
"resint": "后期保障专家。15年专业团队,严谨的作风，顾问式的服务，用品质让客户安心，拥有一站式网落签约资格，让每一笔贷款安全无忧，让交易更简单，让家更温暖。"
}, {
"resname": "法务部",
"img": "./images/Legal.png",
"img": "./images/Legal.jpg",
"resint": "公司最权威的发言者。刚健中正的我们以法律的视角规避交易风险，捍卫权益者应有的合法利益。我们字字珠玑，锱铢必较，我们一直在竭力完善安全交易防火墙。"
},
{
"resname": "财务部",
"img": "./images/Finance.png",
"img": "./images/Finance.jpg",
"resint": "我们是管钱的。我们正直，沉稳而充满活力。财务管理分析是我们的爱好，我们对数字迷恋万分，资深财务导师指导我们严谨的打理公司财务，我们的身份就是财务大管家。"
},
{
"resname": "宣传部",
"img": "./images/Propaganda.png",
"img": "./images/Propaganda.jpg",
"resint": " 一帮充满梦想，搞创作的文艺青年。这里，有趣的灵魂，好看的皮囊，我们都有。优秀的我们，为千家文化的发扬光大，为行业的正名而沉醉。"
}, {
"resname": "科技研发部",
"img": "./images/network.png",
"img": "./images/network.jpg",
"resint": "在这里有一群热爱技术、乐于创造的 GEEK（对电脑痴迷的人）！哼着小曲敲代码，喝着咖啡 DEBUG(排除程序故障)，热爱千家MIS·至哲研发，偶尔写写微信小程序，一言不合自己搭服务器跑算法。最先进的互联技术，最一流的研发和测试设备，用科技解放生产力，让你的创意变成现实！"
}, {
"resname": "市场部",
"img": "./images/market.png",
"img": "./images/market.jpg",
"resint": "资源整合专家。我们洞察市场风云变化，拓展市场新资源，我们还致力于通过规范业务行为，引领行业服务品质新高度，我们是行业前行的探路者."
}
];
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论