tabs javascript function
This commit is contained in:
		
							
								
								
									
										26
									
								
								resources/assets/js/views/common/contacts.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										26
									
								
								resources/assets/js/views/common/contacts.js
									
									
									
									
										vendored
									
									
								
							@@ -42,6 +42,32 @@ const app = new Vue({
 | 
			
		||||
        for (let [index, item] of document.querySelectorAll('[data-swiper]').entries()) {
 | 
			
		||||
            item.id = index;
 | 
			
		||||
 | 
			
		||||
            if (document.querySelector('[data-tabs-swiper-wrapper]').childElementCount > 2) {
 | 
			
		||||
                document.querySelectorAll('[data-tabs-slide]').forEach((item) => {
 | 
			
		||||
                    item.classList.add('swiper-slide');
 | 
			
		||||
                });
 | 
			
		||||
 | 
			
		||||
                document.querySelector('[data-tabs-swiper]').classList.add('swiper', 'swiper-links');
 | 
			
		||||
                document.querySelector('[data-tabs-swiper-wrapper]').classList.add('swiper-wrapper');
 | 
			
		||||
 | 
			
		||||
                let html = `
 | 
			
		||||
                    <div class="swiper-tabs-container">
 | 
			
		||||
                        ${document.querySelector('[data-tabs-swiper]').innerHTML}
 | 
			
		||||
                    </div>
 | 
			
		||||
 | 
			
		||||
                    <div class="swiper-button-next top-3 right-0">
 | 
			
		||||
                        <span class="material-icons">chevron_right</span>
 | 
			
		||||
                    </div>
 | 
			
		||||
                    <div class="swiper-button-prev top-3 left-0">
 | 
			
		||||
                        <span class="material-icons">chevron_left</span>
 | 
			
		||||
                    </div>
 | 
			
		||||
                    `; 
 | 
			
		||||
 | 
			
		||||
                document.querySelector('[data-tabs-swiper]').innerHTML = html; 
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
            // console.log(swiper.activeIndex);
 | 
			
		||||
 | 
			
		||||
            new Swiper(".swiper-tabs-container", {
 | 
			
		||||
                loop: false,
 | 
			
		||||
                slidesPerView: Number(item.getAttribute('data-swiper')),
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user