Как сделать такой слайдер?

Question

[Юрий Кучеренко]

Всем привет, интересует как сделать такой слайдер (По клику на круглые блоки) должны меняться внизу секции с контентом. Хотел реализовать с помощью owl карусели но у меня на проекте их уже 3 штуки, не хочу дальше забивать, нужно реализовать с помощью jquery и не могу сообразить как, в jquery новичек, может кто поможет.. сделал топорную заготовку. Должно выглядеть как - ТУТ в блоке "технологии"

Не могу разобраться в самой технике переключения, пробовал со slideToggle но не получается, может более опытные подскажут новичку. Спасибо

codepen.io/kucherenkozzz/pen/eNjvxK

Comments

[Игорь Воротнёв]

Если уже используется Owl, то почему его не использовать? Это никакое не забивание, библиотека уже есть, загружена и используется, для этой задачи ее же и юзайте. Owl отлично оптимизирован и прекрасно справляется с множественными каруселями на одной странице.

Answer 1

[Serj-One]

Если "в лоб", то можно так.
codepen.io/anon/pen/xGJdKe

Comments

[Юрий Кучеренко]

А как туда можно transition поставить?

[Serj-One]

Юрий Кучеренко: jquery-docs.ru/Effects

[Юрий Кучеренко]

Serj-One: Точно! я и забыл совсем, огромное тебе спасибо за помощь, здоровля, счастья :)

[Николай Ерофеев]

а если например будет 20 слайдов. Ты будешь также в ручную дописывать?

[Николай Ерофеев]

codepen.io/Mackaybravo/pen/xGJyxB

[Serj-One]

Николай Ерофеев: Ответ давался исключительно для того, чтоб человек понял механизм.

[Юрий Кучеренко]

Николай Ерофеев: Это мне чисто механизм понять, но и за твой вариант спасибо, я только начинаю с JS

Answer 2

[Дмитрий Ковальский]

А попробуйте почитать код бутстрапа bootstrap-3.ru/javascript.php#carousel . Он как раз вроде на jquery реализует карусельку

Answer 3

[blolg]

Как вариант можно так codepen.io/blolg/pen/qdymbW

Comments

[Юрий Кучеренко]

А как туда можно transition поставить?

[blolg]

Юрий Кучеренко: Не очень понятен вопрос...
Для того, чтобы были эффекты, можно воспользоваться JQuery функцией slideDown.
codepen.io/blolg/pen/qdymbW

[Юрий Кучеренко]

blolg: Точно! я и забыл совсем, огромное тебе спасибо за помощь, здоровля, счастья :)