Note: If you plan to use containers instead of images for the right tabs, then simply change the word “block” to “flex” in the code at 2 places. (It is commented in code on where to change, also shown in video tutorial)

				
					#1

.dm-right-tab-content-active {


       animation: rightTabReveal 0.5s forwards;
       display: block; /*change to flex if using container*/

   }

#2

 //change block to flex if using container
       dmRightTabs[currentIndex].style.display = 'block';
       dmRightTabs[currentIndex].classList.add('dm-right-tab-content-active');
				
			

AUTOSCROLL TABS #1

NO#1

Auto tabs learning

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

NO#2

Start learning

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

NO#3

Practice & Get Succeed

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

test

Code for Tabs CSS Classes

				
					dm-progress-line-bg
				
			
				
					dm-progress-line
				
			
				
					dm-left-tab-content
				
			
				
					dm-right-tab-content
				
			
				
					dm-right-tab-content-active
				
			

AUTOSCROLL TABS #2

NO#1

Auto tabs learning

NO#2

Start learning

NO#3

Practice for

test