@dieie
Студент колледжа

Как сделать галерею такого типа?

Как при наведении на 2 на главном экране показывало 2? 3 - экран 3?

5e7b52bbeac2b278180942.png
  • Вопрос задан
  • 181 просмотр
Решения вопроса 4
Get-Web
@Get-Web
Front-End Developer
Синхронизированные слайды. Есть готовый пример на slick:
Ответ написан
fergussawyer
@fergussawyer
Front-End
Все слайдеры работают по клику, что бы было при наведении можно написать небольшой скрипт на js
Ответ написан
sniggering_deus
@sniggering_deus
Mother is a god in the eyes of a child.
Это всё можно сделать достаточно просто, например вот так:

Ответ написан
@dieie Автор вопроса
Студент колледжа
Решил вопрос вот так:
<img src="image-1.png" id="myImg" />
<div>
  <img src="image-2.png" onmouseover="SecondImg()" onmouseout="normalImg()" />
  <img src="image-3.png" onmouseover="ThirthImg()" onmouseout="normalImg()" />
  <img src="image-4.png" onmouseover="FourImg()" onmouseout="normalImg()" />
  <img src="image-5.png" onmouseover="FiveImg()" onmouseout="normalImg()" />
</div>


function SecondImg() {
  document.getElementById('myImg').src =
    "image-2.png";
}

function ThirthImg() {
  document.getElementById('myImg').src =
    "image-3.png";
}

function FourImg() {
  document.getElementById('myImg').src =
    "image-4.png";
}

function FiveImg() {
  document.getElementById('myImg').src =
    "image-5.png";
}

function normalImg() {
  document.getElementById('myImg').src =
    "image-1.png";
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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