Authored by biao

update for the slider style

... ... @@ -4,12 +4,28 @@ const getContent = () => {
{
slider: [
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
}
]
},
... ...
... ... @@ -70,22 +70,22 @@
position: absolute;
top: 50%;
margin: -30px 0 0;
width: 60px;
width: 30px;
height: 60px;
line-height: 56px;
text-align: center;
z-index: 2;
background: #fff;
background: #000;
opacity: 0.55;
&.prev {
left: 50%;
margin-left: -575px;
margin-left: -545px;
}
&.next {
right: 50%;
margin-right: -575px;
margin-right: -545px;
}
&:hover {
... ... @@ -146,25 +146,25 @@
right: 0;
top: 0;
bottom: 0;
background: #000;
opacity: 0.3;
border-radius: 13px;
/*background: #000;*/
}
span {
position: relative;
display: inline-block;
margin: 0 7px;
width: 12px;
height: 12px;
background: #fff;
margin: 0 3px;
width: 7px;
height: 7px;
background: #ccc;
cursor: pointer;
opacity: 0.6;
border-radius: 6px;
z-index: 2;
&.focus {
opacity: 1;
width: 12px;
height: 12px;
position: relative;
top: 2px;
background: #fff;
}
}
}
... ...
... ... @@ -31,28 +31,23 @@
right: 0;
top: 0;
bottom: 0;
background: #000;
opacity: 0.3;
border-radius: 13px;
}
/*
.slide-pagination-last span {
display: block;
float: left;
position: relative;
margin: 0 7px;
width: 12px;
height: 12px;
margin: 0 3px;
width: 6px;
height: 6px;
background: #fff;
cursor: pointer;
opacity: 0.6;
border-radius: 6px;
z-index: 2;
&.focus {
opacity: 1;
}
}
*/
.slide-switch {
display: none;
... ... @@ -66,12 +61,12 @@
position: absolute;
top: 50%;
margin: -30px 0 0;
width: 60px;
width: 30px;
height: 60px;
line-height: 56px;
text-align: center;
z-index: 2;
background: #fff;
background: #000;
opacity: 0.55;
&:hover {
... ...