@533va

Как сделать подобный slick-слайдер?

Здравствуйте!
Есть такой slick-слайдер - https://terrabites.eu/#home-intro

Вопрос. Может кто-нибудь направить в нужное русло? Имею ввиду, как осуществить такую тему.
Возможно, что вопрос довольно легкий, но сам я новичок и не знаю, как это сделать.
  • Вопрос задан
  • 156 просмотров
Решения вопроса 1
Get-Web
@Get-Web
Front-End Developer
У них это работает на fullPage.js
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Dimarik9
@Dimarik9
Веб дизайнер
Можно только на css html вот код :
<style>
		.saitbar {
			width:90%;
			height:100%;
			background: #f0f0f0;
			transform: translateY(-100%);
			transition: 0.5s;
			position:absolute;
			top:0px;
			left:10%;
		}
		.saitbar1 {
			width:90%;
			height:100%;
			background:red;
			transform: translateY(-100%);
			transition: 0.5s;
			position:absolute;
			top:0px;
			left:10%;
		}
		.saitbar2 {
			width:90%;
			height:100%;
			background:green;
			transform: translateY(-100%);
			transition: 0.5s;
			position:absolute;
			top:0px;
			left:10%;
		}
		.button:hover .saitbar{
			transform: translateY(0);
		}
		.button:hover .saitbar1{
			transform: translateY(0);
		}
		.button:hover .saitbar2{
			transform: translateY(0);
		}
		.button{
			width:50px;
			height:50px;
			background-color:#494949;
			border-radius:25px;
			margin-top:30px;
		}
		body{
			color:#494949;
			font-size:40px;
			font-family:Arial;
		}
	</style>
<body>
	<div class="button">
		<div class="saitbar">привет</div>
	</div>
	<div class="button">
		<div class="saitbar1">как дела</div>
	</div>
	<div class="button">
		<div class="saitbar2">привет , мир</div>
	</div>
</body>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы