jQuery Smart Wizard nav scrall

Using jQuery Smart Wizard. I have 8 steps and it showing all 8 tab nav in one line It is possible show only 2 and other will be showing using next button ?

<!-- CSS -->
<link href="https://unpkg.com/smartwizard@5/dist/css/smart_wizard_all.min.css" rel="stylesheet" type="text/css" />

<!-- JavaScript -->
<script src="https://unpkg.com/smartwizard@5/dist/js/jquery.smartWizard.min.js" type="text/javascript"></script>

<div id="smartwizard">
    <ul class="nav">
       <li>
           <a class="nav-link" href="#step-1">
              Step 1
           </a>
       </li>
       <li>
           <a class="nav-link" href="#step-2">
              Step 2
           </a>
       </li>
       <li>
           <a class="nav-link" href="#step-3">
              Step 3
           </a>
       </li>
       <li>
           <a class="nav-link" href="#step-4">
              Step 4
           </a>
       </li>

       <li>
           <a class="nav-link" href="#step-5">
              Step 5
           </a>
       </li>


       <li>
           <a class="nav-link" href="#step-4">
              Step 4
           </a>
       </li>


       <li>
           <a class="nav-link" href="#step-6">
              Step 6
           </a>
       </li>

       <li>
           <a class="nav-link" href="#step-7">
              Step 7
           </a>
       </li>
       <li>
           <a class="nav-link" href="#step-8">
              Step 8
           </a>
       </li>
    </ul>
 
    <div class="tab-content">
       <div id="step-1" class="tab-pane" role="tabpanel">
          Step content111
       </div>
       <div id="step-2" class="tab-pane" role="tabpanel">
          Step content22
       </div>
       <div id="step-3" class="tab-pane" role="tabpanel">
          Step content33
       </div>
       <div id="step-4" class="tab-pane" role="tabpanel">
          Step content44
       </div>
       <div id="step-5" class="tab-pane" role="tabpanel">
          Step conten555
       </div>
       <div id="step-6" class="tab-pane" role="tabpanel">
          Step content55
       </div>
       <div id="step-7" class="tab-pane" role="tabpanel">
          Step content777
       </div>
       <div id="step-8" class="tab-pane" role="tabpanel">
          Step content8888
       </div>
    </div>
</div>


<script>
jQuery(document).ready(function($){
 
$('#smartwizard').smartWizard({
  selected: 0, // Initial selected step, 0 = first step
  theme: 'dots', // theme for the wizard, related css need to include for other than default theme
  justified: true, // Nav menu justification. true/false
  darkMode:false, // Enable/disable Dark Mode if the theme supports. true/false
  autoAdjustHeight: true, // Automatically adjust content height
  cycleSteps: false, // Allows to cycle the navigation of steps
  backButtonSupport: true, // Enable the back button support
  enableURLhash: true, // Enable selection of the step based on url hash
  transition: {
      animation: 'none', // Effect on navigation, none/fade/slide-horizontal/slide-vertical/slide-swing
      speed: '400', // Transion animation speed
      easing:'' // Transition animation easing. Not supported without a jQuery easing plugin
  },
  toolbarSettings: {
      toolbarPosition: 'bottom', // none, top, bottom, both
      toolbarButtonPosition: 'right', // left, right, center
      showNextButton: true, // show/hide a Next button
      showPreviousButton: true, // show/hide a Previous button
      toolbarExtraButtons: [] // Extra buttons to show on toolbar, array of jQuery input/buttons elements
  },
  anchorSettings: {
      anchorClickable: true, // Enable/Disable anchor navigation
      enableAllAnchors: true, // Activates all anchors clickable all times
      markDoneStep: true, // Add done state on navigation
      markAllPreviousStepsAsDone: true, // When a step selected by url hash, all previous steps are marked done
      removeDoneStepOnNavigateBack: false, // While navigate back done step after active step will be cleared
      enableAnchorOnDoneStep: true // Enable/Disable the done steps navigation
  },
  keyboardSettings: {
      keyNavigation: true, // Enable/Disable keyboard navigation(left and right keys are used if enabled)
      keyLeft: [37], // Left key code
      keyRight: [39] // Right key code
  },
  lang: { // Language variables for button
      next: 'Next',
      previous: 'Previous'
  },
  disabledSteps: [], // Array Steps disabled
  errorSteps: [], // Highlight step with errors
  hiddenSteps: [] // Hidden steps
});
  
});

					</script>