Save

wp-content/themes/hello-elementor/assets/js/custom.js

@@ -12,10 +12,15 @@ jQuery(function ($) {
 		}
 	})
 
-	$('#frame-box .frame-box-content-bg, #frame-box .frame-box-content-bg img').css('width', `${frameScrollWidth}px`)
+	$(
+		'#frame-box .frame-box-content-bg, #frame-box .frame-box-content-bg img'
+	).css('width', `${frameScrollWidth}px`)
 	$('#frame-box .piano-keys').css('width', `${frameScrollWidth}px`)
 	frameScrollWidth = frameScrollWidth - parseFloat($('#frame-box').width())
-	$('.frame-box-content-data, #frame-box .piano').css( 'width', `${frameScrollWidth}px` )
+	$('.frame-box-content-data, #frame-box .piano').css(
+		'width',
+		`${frameScrollWidth}px`
+	)
 
 	let dragHandle = document.querySelector('#drag-handle')
 	Draggable.create(dragHandle, {
@@ -100,21 +105,37 @@ jQuery(function ($) {
 	$('#frame-box nav #nav_foto').on('click', function () {
 		$('#frame-box #foto').show()
 		$('#frame-box #plyty').hide()
+		$('#frame-box #biogram').hide()
 	})
 	$('#frame-box nav #nav_plyty').on('click', function () {
 		$('#frame-box #foto').hide()
 		$('#frame-box #plyty').show()
+		$('#frame-box #biogram').hide()
 	})
 	$('#frame-box nav #nav_intro').on('click', function () {
 		$('#frame-box #intro').show()
 		$('#frame-box #foto').hide()
 		$('#frame-box #plyty').hide()
+		$('#frame-box #biogram').hide()
 	})
 
 	$('#frame-box #intro p').on('click', function () {
 		$('#frame-box #intro').hide()
 		$('#frame-box #foto').hide()
 		$('#frame-box #plyty').show()
+		$('#frame-box #biogram').hide()
+	})
+
+	$('#frame-box nav #nav_biogram').on('click', function () {
+		$('#frame-box #biogram').show()
+		$('#frame-box #intro').hide()
+		$('#frame-box #foto').hide()
+		$('#frame-box #plyty').hide()
+	})
+
+	$('#frame-box nav#nav ul#nav_ul li').on('click', function () {
+		$('#frame-box nav#nav ul#nav_ul li').removeClass('active')
+		$(this).addClass('active')
 	})
 })
 
@@ -181,17 +202,17 @@ jQuery(function ($) {
 			turning: function (event, page, view) {
 				if (page === 1) {
 					// event.preventDefault()
-                    if (!$(event.target).closest('a').length) {
-						event.preventDefault();
+					if (!$(event.target).closest('a').length) {
+						event.preventDefault()
 					}
 				}
 			},
 		},
 	})
 
-    $('#flipbook').on('touchstart', 'a', function (event) {
-		event.stopPropagation();
-	});
+	$('#flipbook').on('touchstart', 'a', function (event) {
+		event.stopPropagation()
+	})
 
 	$(document).on('click', 'ul.table-of-contents', function (e) {
 		e.stopPropagation()
@@ -211,3 +232,32 @@ jQuery(function ($) {
 		$('#flipbook').turn('page', 2)
 	})
 })
+
+jQuery(function ($) {
+	var swiper_biogram = new Swiper('.swiper_biogram', {
+		// Не використовуємо стандартну пагінацію Swiper
+		loop: false,
+		on: {
+			slideChange: function () {
+				updateCustomPagination(swiper_biogram.activeIndex)
+			},
+		},
+	})
+
+	// Прив'язуємо кліки по елементах пагінації
+	$('.swiper-pagination li').each(function (index) {
+		$(this).on('click', function () {
+			swiper_biogram.slideTo(index)
+			updateCustomPagination(index)
+		})
+	})
+
+	// Функція для оновлення активного пункту
+	function updateCustomPagination(activeIndex) {
+		$('.swiper-pagination li').removeClass('active')
+		$('.swiper-pagination li').eq(activeIndex).addClass('active')
+	}
+
+	// Ініціалізація активного елемента
+	updateCustomPagination(0)
+})