Skip to content

html / bdideal

Go to a project
Commit 4afc3b34 by hank
Options

首页样式修改

parent dc28bce9
Showing with 163 additions and 106 deletions
html/about.html
...@@ -274,7 +274,7 @@ ...@@ -274,7 +274,7 @@
var content = var content =
'<div style="margin:0;line-height:20px;padding:2px;background:white;">' + '<div style="margin:0;line-height:20px;padding:2px;background:white;">' +
'<img src="../img/weixin.png" alt="" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>' + '<img src="../img/weixin.png" alt="" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>' +
'地址：北京市海淀区知春路甲48号<br/>电话：(010)58732488<br/>' + '地址：北京市海淀区知春路甲48号<br/>电话：010-58060808<br/>' +
'</div>'; '</div>';
//创建检索信息窗口对象 //创建检索信息窗口对象
......
html/index.html
...@@ -554,6 +554,19 @@ ...@@ -554,6 +554,19 @@
$(document).ready(function () { $(document).ready(function () {
var sliceNum = 6; // 展示数量 var sliceNum = 6; // 展示数量
var sliceNum2 = 4; // 展示数量 var sliceNum2 = 4; // 展示数量
var active2 = $('.views-content .one');
var active1 = $('.views-content .two');
active2.mouseenter(function (param) {
active1.addClass("active1")
active2.addClass("active2")
})
active1.mouseenter(function (param) {
active1.removeClass("active1")
active2.removeClass("active2")
// active1.addClass("active1")
// active2.addClass("active2")
})
var mySwiper = new Swiper('.swiper-container', { var mySwiper = new Swiper('.swiper-container', {
direction: 'horizontal', // 垂直切换选项 direction: 'horizontal', // 垂直切换选项
loop: true, // 循环模式选项 loop: true, // 循环模式选项
......
html/products.html
...@@ -529,10 +529,12 @@ ...@@ -529,10 +529,12 @@
'<div class="img-container">' + '<div class="img-container">' +
'<img src="' + '<img src="' +
item.imagesUrl + item.imagesUrl +
// item.thumb +
'" alt="">' + '" alt="">' +
'</div>' + '</div>' +
'<div class="item-title"> ' + '<div class="item-title"> ' +
item.proName + item.proName +
// item.title +
'</div>' + '</div>' +
'<ul class="tag-list">' + '<ul class="tag-list">' +
(function (a) { (function (a) {
...@@ -566,7 +568,33 @@ ...@@ -566,7 +568,33 @@
// // 如果需要分页器 // // 如果需要分页器
// pagination: '.swiper-pagination' // pagination: '.swiper-pagination'
}); });
update(); // update();
$.ajax({
type: 'get',
url: "http://bdideal-cms.iyunfish.com/index.php?m=api&c=news&a=index&type=case"
}).done(function(res){
console.log(JSON.parse(res))
var res = JSON.parse(res);
ideal.produtsList = res.data;
var html= ""
res.data.forEach( function (item,index) {
if(index==0) {
html += '<div class="menu-item active">' + item.catname + '</div>'
} else {
html += '<div class="menu-item">' + item.catname + '</div>'
}
})
// $(".menu-list").html(html)
// update(createHtml(res.data[0].news))
// tab();
})
update()
function update(html) { function update(html) {
$('#swiper1') $('#swiper1')
.children() .children()
...@@ -594,11 +622,12 @@ ...@@ -594,11 +622,12 @@
.removeClass('active'); .removeClass('active');
$(this).addClass('active'); $(this).addClass('active');
var index = $(this).index(); var index = $(this).index();
update(); // mySwiper.slideTo(0, 1000, false);
mySwiper.slideTo(0, 1000, false); // update(createHtml(ideal.produtsList[index].news));
}); });
} }
tab(); tab()
function computeMasking(swiper) { function computeMasking(swiper) {
......
style/index.css
...@@ -356,49 +356,6 @@ ul { ...@@ -356,49 +356,6 @@ ul {
border: 1px solid #A7A7A7; border: 1px solid #A7A7A7;
cursor: pointer; cursor: pointer;
} }
.our-products .views-content .left-item:hover .introduce {
background: url('../img/index_02bgpink.png') no-repeat top center;
background-size: cover;
}
.our-products .views-content .left-item:hover .introduce .top {
padding-top: 60px;
}
.our-products .views-content .left-item:hover .introduce .top .line1 {
width: 169px;
height: 1px;
background: #fff;
}
.our-products .views-content .left-item:hover .introduce .top .line2 {
width: 33px;
height: 1px;
background: #fff;
}
.our-products .views-content .left-item:hover .introduce .top .name {
font-size: 24px;
font-weight: 400;
color: #fff;
line-height: 1;
padding-top: 17px;
padding-bottom: 9px;
}
.our-products .views-content .left-item:hover .introduce .top .en {
font-size: 12px;
font-weight: 300;
line-height: 1;
color: #fff;
padding-bottom: 18px;
}
.our-products .views-content .left-item:hover .introduce .bottom {
padding-top: 40px;
color: #fff;
font-size: 14px;
line-height: 30px;
}
.our-products .views-content .left-item:hover a {
display: inline-block;
color: #fff;
border: 1px solid #ffffff;
}
.our-products .views-content .introduce { .our-products .views-content .introduce {
width: 340px; width: 340px;
height: 411px; height: 411px;
...@@ -515,27 +472,27 @@ ul { ...@@ -515,27 +472,27 @@ ul {
color: #fff; color: #fff;
border: 1px solid #ffffff; border: 1px solid #ffffff;
} }
.our-products .views-content .two:hover .introduce { .our-products .views-content .active1 .introduce {
width: 340px; width: 340px;
height: 411px; height: 411px;
background: url('../img/mapbg.png') no-repeat top center; background: url('../img/mapbg.png') no-repeat top center;
background-size: cover; background-size: cover;
padding-left: 34px; padding-left: 34px;
} }
.our-products .views-content .two:hover .introduce .top { .our-products .views-content .active1 .introduce .top {
padding-top: 60px; padding-top: 60px;
} }
.our-products .views-content .two:hover .introduce .top .line1 { .our-products .views-content .active1 .introduce .top .line1 {
width: 169px; width: 169px;
height: 1px; height: 1px;
background: #c70151; background: #c70151;
} }
.our-products .views-content .two:hover .introduce .top .line2 { .our-products .views-content .active1 .introduce .top .line2 {
width: 33px; width: 33px;
height: 1px; height: 1px;
background: #c70151; background: #c70151;
} }
.our-products .views-content .two:hover .introduce .top .name { .our-products .views-content .active1 .introduce .top .name {
font-size: 24px; font-size: 24px;
font-weight: 400; font-weight: 400;
color: #c70151; color: #c70151;
...@@ -543,25 +500,68 @@ ul { ...@@ -543,25 +500,68 @@ ul {
padding-top: 17px; padding-top: 17px;
padding-bottom: 9px; padding-bottom: 9px;
} }
.our-products .views-content .two:hover .introduce .top .en { .our-products .views-content .active1 .introduce .top .en {
font-size: 12px; font-size: 12px;
font-weight: 300; font-weight: 300;
line-height: 1; line-height: 1;
color: #c70151; color: #c70151;
padding-bottom: 18px; padding-bottom: 18px;
} }
.our-products .views-content .two:hover .introduce .bottom { .our-products .views-content .active1 .introduce .bottom {
padding-top: 40px; padding-top: 40px;
color: #979797; color: #979797;
font-size: 14px; font-size: 14px;
line-height: 30px; line-height: 30px;
} }
.our-products .views-content .two:hover a { .our-products .views-content .active1 a {
display: inline-block; display: inline-block;
color: #A7A7A7; color: #A7A7A7;
border: 1px solid #A7A7A7; border: 1px solid #A7A7A7;
cursor: pointer; cursor: pointer;
} }
.our-products .views-content .active2 .introduce {
background: url('../img/index_02bgpink.png') no-repeat top center;
background-size: cover;
}
.our-products .views-content .active2 .introduce .top {
padding-top: 60px;
}
.our-products .views-content .active2 .introduce .top .line1 {
width: 169px;
height: 1px;
background: #fff;
}
.our-products .views-content .active2 .introduce .top .line2 {
width: 33px;
height: 1px;
background: #fff;
}
.our-products .views-content .active2 .introduce .top .name {
font-size: 24px;
font-weight: 400;
color: #fff;
line-height: 1;
padding-top: 17px;
padding-bottom: 9px;
}
.our-products .views-content .active2 .introduce .top .en {
font-size: 12px;
font-weight: 300;
line-height: 1;
color: #fff;
padding-bottom: 18px;
}
.our-products .views-content .active2 .introduce .bottom {
padding-top: 40px;
color: #fff;
font-size: 14px;
line-height: 30px;
}
.our-products .views-content .active2 a {
display: inline-block;
color: #fff;
border: 1px solid #ffffff;
}
.left-menu { .left-menu {
display: inline-block; display: inline-block;
background: url('/img/bg3.png') top center no-repeat; background: url('/img/bg3.png') top center no-repeat;
......
style/index.less
...@@ -380,54 +380,6 @@ ul { ...@@ -380,54 +380,6 @@ ul {
color: #A7A7A7; color: #A7A7A7;
border:1px solid #A7A7A7; border:1px solid #A7A7A7;
cursor: pointer; cursor: pointer;
}
&:hover {
.introduce {
// background-image: url('') !important;
background: url('../img/index_02bgpink.png') no-repeat top center;
background-size: cover;
.top {
padding-top: 60px;
.line1 {
width:169px;
height:1px;
// background:rgba(199,1,81,1);
background: #fff;
}
.line2 {
width:33px;
height:1px;
background: #fff; }
.name{
font-size:24px;
font-weight:400;
color: #fff;
line-height: 1;
padding-top: 17px;
padding-bottom: 9px;
}
.en {
font-size:12px;
font-weight:300;
line-height: 1;
color:#fff;
padding-bottom: 18px;
}
}
.bottom {
padding-top: 40px;
color: #fff;
font-size: 14px;
line-height: 30px;
}
}
a {
display: inline-block;
color: #fff;
border:1px solid #ffffff;
}
} }
} }
.introduce { .introduce {
...@@ -548,7 +500,10 @@ ul { ...@@ -548,7 +500,10 @@ ul {
color: #fff; color: #fff;
border:1px solid #ffffff; border:1px solid #ffffff;
} }
&:hover {
}
.active1 {
.introduce { .introduce {
width:340px; width:340px;
height: 411px; height: 411px;
...@@ -597,9 +552,55 @@ ul { ...@@ -597,9 +552,55 @@ ul {
cursor: pointer; cursor: pointer;
} }
}
.active2{
.introduce {
// background-image: url('') !important;
background: url('../img/index_02bgpink.png') no-repeat top center;
background-size: cover;
.top {
padding-top: 60px;
.line1 {
width:169px;
height:1px;
// background:rgba(199,1,81,1);
background: #fff;
}
.line2 {
width:33px;
height:1px;
background: #fff; }
.name{
font-size:24px;
font-weight:400;
color: #fff;
line-height: 1;
padding-top: 17px;
padding-bottom: 9px;
}
.en {
font-size:12px;
font-weight:300;
line-height: 1;
color:#fff;
padding-bottom: 18px;
}
}
.bottom {
padding-top: 40px;
color: #fff;
font-size: 14px;
line-height: 30px;
}
}
a {
display: inline-block;
color: #fff;
border:1px solid #ffffff;
}
} }
} }
}
} }
// 解决方案 // 解决方案
.left-menu { .left-menu {
......
style/solution.css
...@@ -581,6 +581,13 @@ ul { ...@@ -581,6 +581,13 @@ ul {
color: #999999; color: #999999;
line-height: 22px; line-height: 22px;
font-size: 14px; font-size: 14px;
-webkit-transition: all 1s;
transition: all 1s;
}
.jobs .detail:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
z-index: 999;
} }
.jobs h3 { .jobs h3 {
text-align: center; text-align: center;
......
style/solution.less
...@@ -621,6 +621,13 @@ ul { ...@@ -621,6 +621,13 @@ ul {
color: #999999; color: #999999;
line-height: 22px; line-height: 22px;
font-size:14px; font-size:14px;
-webkit-transition: all 1s;
transition: all 1s;
&:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
z-index: 999;
}
} }
h3 { h3 {
text-align: center; text-align: center;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment