Skip to content

Руслан Ибрагимов / yescenter

Go to a project
Commit a2c85aeb by Ruha
Options

final

1 parent 40e4ec2d
Pipeline #2769 for a2c85aeb skipped in 0 seconds
Expand all
Inline Side-by-side
Showing 9 changed files with 159 additions and 41 deletions
css/additional.css
......@@ -7,11 +7,84 @@
/*margin-bottom: 18px;*/
/*height: auto;*/
/*}*/
@media only screen and (max-width: 600px) { .photo-slider { display: block; }}
.video-slider .slick-dots li{
display: inline-block;
padding:5px;
cursor:pointer;
}
.video-slider .slick-dots {
position:relative;
left:calc(67% - 20px);
width:50px;
text-align: center;
top:14px;
}
@media only screen and (max-width: 1024px) { .video-slider .slick-dots { left:67%}}
@media only screen and (max-width: 800px) { .video-slider .slick-dots { left:64%}}
@media only screen and (max-width: 360px) { .video-slider .slick-dots { left:44%}}
.video-slider .slick-dots button {
margin:6px 0 0 0;
color:transparent;
font-size:0px;
border-radius: 20px;
background: white;
opacity:0.2;
padding:4px;
}
.video-slider .slick-dots li.slick-active button {background-color: #ec1c24;
opacity: 1;}
.video-slider iframe {height:420px;}
@media only screen and (max-width: 1160px) { .video-slider iframe {height:420px;} }
@media only screen and (max-width: 960px) { .video-slider iframe {height:380px;} }
@media only screen and (max-width: 768px) { .video-slider iframe {height:300px;} }
.photo-slider {
width: 104%;
}
.photo-slider .slick-arrow {
height:42px!important;
top:45%;
}
.photo-slider .slick-dots li{
display: inline-block;
padding:5px;
cursor:pointer;
}
.photo-slider .slick-dots {
text-align: center;
position:relative;
}
.photo-slider .slick-dots button {
margin:6px 0 0 0;
color:transparent;
font-size:0px;
border-radius: 20px;
background: #383838;
opacity:0.2;
padding:4px;
}
.photo-slider .slick-dots li.slick-active button {background-color: #ec1c24;
opacity: 1;}
.slick-prev::before, .slick-next::before {
width:45px;
height:45px!important;
}
.photo-slider .slick-arrow:before {
color: transparent;
}
.photo-slider .slick-next {
right: 2%;
}
.photo-slider .slick-next:before {
background: url("../img/right.png");
background-size: cover;
}
.photo-slider .slick-prev:before {
background: url("../img/left.png");
background-size: cover;
}
/* styles */
.nowrap {
white-space: nowrap;
......
css/style.css
......@@ -460,14 +460,13 @@ body { font-family: PFAgoraSansPro; }
.b4 .ov1 .ll1 img { -webkit-border-radius: 14px; border-radius: 14px; display: block; margin-bottom: 18px; max-width: 100%; height: auto; }
@media only screen and (max-width: 960px) { .b4 .ov1 .ll1 img { margin-bottom: 11px; } }
@media only screen and (max-width: 960px) { .b4 .ov1 .ll1 img { margin-bottom: 11px; max-width: 98%} }
@media only screen and (max-width: 1160px) { .b4 .ov1 .ll1 img { margin-bottom: 11px; max-width: 98%} }
.b4 .ov1 .ll1 span { display: block; color: #acacac; font-family: Arial; font-size: 14px; font-weight: 400; line-height: 15px; }
@media only screen and (max-width: 960px) { .b4 .ov1 .ll1 span { color: #acacac; font-family: Arial; font-size: 13px; font-weight: 400; } }
@media only screen and (max-width: 600px) { .b4 .ov1 .ll1 { display: none; } }
.b4 .ov1 .sl3 { display: none; }
@media only screen and (max-width: 600px) { .b4 .ov1 .sl3 { display: block; }
......
img/left.png 0 → 100644
img/left.png

40.2 KB
index.html
......@@ -7,12 +7,8 @@
<![endif]-->
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="css/additional.css" type="text/css">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection"/>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/moment.min.js"></script>
<link rel="stylesheet" href="css/additional.min.css" type="text/css">
<link rel="stylesheet" href="css/style.min.css" type="text/css" media="screen, projection"/>
</head>
<body>
......@@ -60,7 +56,7 @@
</li>
<li>
<span>3</span>
<div>Прибыль <br>от 800 000 рублей в месяц</div>
<div>Прибыль <br>до 800 000 рублей в месяц</div>
</li>
<li>
<span>4</span>
......@@ -136,9 +132,9 @@
<div class="ov2">
<div class="item1">
<ul>
<li>Уникальная методика обучения</li>
<li>Помощь в поиске помещения <br>для школы</li>
<li>Полный пакет документов, бизнес-<br>схем и алгоритмов для работы школы</li>
<li>Обучение для новых сотрудников после запуска</li>
</ul>
</div>
<div class="item1">
......@@ -151,8 +147,10 @@
<div class="item1">
<ul>
<li>Периодические общие тренинги по разным направлениям</li>
<li>Поддержка опытных специалистов на любом этапе развития вашего бизнеса</li>
<li>Обучение для новых сотрудников после запуска</li>
<li>Поддержка опытных специалистов на любом этапе развития вашего бизнеса + персональный
наставник
</li>
<li>Уникальная методика обучения</li>
</ul>
</div>
</div>
......@@ -165,15 +163,13 @@
<div class="ct">
<div class="t1">Яркий и узнаваемый бренд</div>
<div class="ov1 photo-slider">
<div class="ll1 photo-slide"><img src="img/w4.jpg" alt=""><span>Офис-франчайзи в Санкт-Петербурге</span></div>
<div class="ll1 photo-slide"><img src="img/w5.jpg" alt=""><span>Офис-франчайзи в Туле</span></div>
<div class="ll1 photo-slide"><img src="img/w10.jpg" alt=""><span>5</span></div>
<div class="ll1 photo-slide"><img src="img/w6.jpg" alt=""><span>1</span></div>
<div class="ll1 photo-slide"><img src="img/w7.jpg" alt=""><span>2</span></div>
<div class="ll1 photo-slide"><img src="img/w8.jpg" alt=""><span>3</span></div>
<div class="ll1 photo-slide"><img src="img/w9.jpg" alt=""><span>4</span></div>
<div class="ll1 photo-slide"><img src="img/w4.jpg" alt=""><span></span></div>
<div class="ll1 photo-slide"><img src="img/w10.jpg" alt=""><span></span></div>
<div class="ll1 photo-slide"><img src="img/w6.jpg" alt=""><span></span></div>
<div class="ll1 photo-slide"><img src="img/w7.jpg" alt=""><span></span></div>
<div class="ll1 photo-slide"><img src="img/w8.jpg" alt=""><span></span></div>
<div class="ll1 photo-slide"><img src="img/w9.jpg" alt=""><span></span></div>
<div class="ll1 photo-slide"><img src="img/w5.jpg" alt=""><span></span></div>
</div>
<p class="p1">Логотип Школы иностранных языков YES — не просто фирменный знак, это знак качества.
Изображенный в форме круглой печати, он символизирует многолетний успешный опыт обучения иностранным
......@@ -183,15 +179,22 @@
</div>
<div class="b5">
<div class="ct">
<div class="t1">Языковые школы YES</div>
<div class="t1">О языковых школах YES</div>
<div class="ll1">
<img src="img/av2.jpg" alt="">
<span>Сергей Афанаскин</span>
<p>Основатель и генеральный директор <br>сети Центров иностранных языков YES</p>
</div>
<div class="rr1">
<div class="ov-play">
<div id="player" dt="yKXRL2kZudM"></div>
<div class="video-slider">
<div class="">
<div class="ov-play video-slider">
<div id="player" dt="o1pDFYypZ0Q"></div>
</div>
</div>
<div class="">
<div class="ov-play video-slider">
<div id="player2" dt="yKXRL2kZudM"></div>
</div>
</div>
</div>
</div>
......@@ -258,13 +261,15 @@
<div class="rr1"><a href=""><img src="img/logo2.png" alt=""></a></div>
<div class="rr2">
<a href=""><img src="img/logo2.png" alt=""></a>
<p>Частное образовательное учреждение <br>дополнительного образования <br>«Школа иностранных языков «Ес»
<p>Частное образовательное учреждение <br>дополнительного образования <br>«Школа иностранных языков
«Ес»
</p>
</div>
<div class="ll1">
<p>
<span>Частное образовательное учреждение дополнительного образования «Школа иностранных языков «Ес» <br></span>Юридический
адрес: 140180, Московская обл., г.Жуковский, ул.Гудкова, д. 21 <br>ИНН 5013045939 КПП 501301001 <br>ОГРН
адрес: 140180, Московская обл., г.Жуковский, ул.Гудкова, д. 21 <br>ИНН 5013045939 КПП 501301001
<br>ОГРН
1035002607023</p>
</div>
</div>
......@@ -291,7 +296,7 @@
<fieldset>
<input type="hidden" name="type" value="callback">
<label for="phone">&nbsp;</label>
<input type="text" name="phone" id="phone" class="input" placeholder="8 999 4444444" >
<input type="text" name="phone" id="phone" class="input" placeholder="8 999 4444444">
</fieldset>
<fieldset class="time tm">
<label for="from">&nbsp;</label>
......@@ -523,9 +528,13 @@
myMap.controls.remove('fullscreenControl');
myMap.controls.remove('geolocationControl');
myMap.controls.remove('rulerControl');
};
}
;
ymaps.ready(init);
</script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/app.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/moment.min.js"></script>
<script type="text/javascript" src="js/common.min.js"></script>
</body>
</html>
\ No newline at end of file
js/app.js
This diff could not be displayed because it is too large.
js/app.min.js 0 → 100644
This diff could not be displayed because it is too large.
js/common.js
......@@ -62,9 +62,34 @@ $(document).ready(function () {
$('.photo-slider').slick({
slidesToShow: 2,
slidesToScroll:2,
arrows: true,
dots: false,
adaptiveHeight: true
arrows: false,
dots: true,
adaptiveWidth: true,
responsive: [
{
breakpoint: 652,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
},
{
breakpoint: 1025,
settings: {
slidesToShow: 2,
slidesToScroll: 1,
adaptiveWidth: true
}
}
]
});
$('.video-slider').slick({
slidesToShow: 1,
slidesToScroll:1,
arrows: false,
dots: true,
adaptiveWIdth: true,
draggable: true
});
$('.sl1').slick({
arrows: false,
......@@ -118,6 +143,8 @@ tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
var player2;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '100%',
......@@ -130,12 +157,22 @@ function onYouTubeIframeAPIReady() {
}
}
});
}
$('.play1 span').click(function (e) {
e.preventDefault();
$(this).parent().fadeOut(200);
player2 = new YT.Player('player2', {
height: '100%',
width: '100%',
videoId: $('#player2').attr('dt'),
events: {
'onReady': function () {
player.playVideo();
});
player.stopVideo();
}
}
});
}
var overlay = $('#overlay');
$('.ord1').click(function (e) {
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!