$(document).ready(function() {
  var totalItems = $('.sliderItem', '#slider').length;
  var currentIndex = $('.itemActive').index() + 1;
  var slideTime = 3000;

  function goNext(e) {
    $('.sliderItem').eq(e).stop().fadeOut(500);
    $('.welcomeBox > .welcomeText1', '.sliderItem').eq(e).stop().hide(500);
    $('h1', '.sliderItem').eq(e).stop().hide(500);
    $('h2', '.sliderItem').eq(e).stop().hide(500);
    if (e == totalItems - 1) {
      e = 0;
    } else {
      e++;
    };
    $('.sliderItem').eq(e).stop().fadeIn(400);
    $('h1', '.sliderItem').eq(e).stop().delay(800).show(400);
    $('h2', '.sliderItem').eq(e).stop().delay(500).show(400);
    $('.welcomeBox > .welcomeText1', '.sliderItem').eq(e).stop().delay(300).show(400);
    currentIndex = e;
  };


  function loader() {
    $('.loader').animate({
      "width": "100%"
    }, slideTime - 199);
    $('.loader').animate({
      "opacity": "0"
    }, 199);
    $('.loader').animate({
      "width": "0%"
    }, 0);
    $('.loader').animate({
      "opacity": "1"
    }, 0);
  };


  function autoPlay(e) {
    timer = setInterval(function() {
      loader();
      goNext(e - 1);
      if (e == totalItems) {
        e = 1;
      } else {
        e++;
      };
      currentIndex = e;
    }, slideTime);

  };
  autoPlay(currentIndex);

});

body {
  background: black;
}

#slider {
  position: relative;
  width: 100%;
  height: 100%;
  color: #FFF;
  padding: 30px;
}

#slider a {
  color: #FFF;
}

.sliderItem {
  position: absolute;
  /* background: rgba(0, 0, 0, 0.28); */
  display: none;
  width: 100%;
  padding: 57px;
  margin: 0;
}

.sliderItem .welcomeText1 {
  display: none;
}

.sliderItem h1,
.sliderItem h2,
.sliderItem h3,
.sliderItem>.welcomeBox>.welcomeText {
  display: none;
}

.itemActive {
  display: block;
}

.itemSelectors {
  position: absolute;
  bottom: 0;
  display: block;
}

.itemSelectors>.selector {
  background: #FFF;
  color: #3b7cbc;
  font-size: 18px;
  line-height: 40px;
  text-align: center;
  font-weight: bold;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-block;
  margin: 0 0 0 10px;
  cursor: pointer;
}

.activeSelect {
  background: #3a3a3a !important;
  color: #FFF !important;
  pointer-events: none;
}

.ms-nav-prev {
  width: 30px;
  background: url(https://xhosting.co.il/libraries/themes/xhosting/js/masterslider/skins/default/light-skin-1.png);
  background-position: -89px -103px;
  height: 40px;
  cursor: pointer;
  top: 50%;
  right: 30px;
  left: auto;
  position: absolute;
  z-index: 110;
}

.ms-nav-next {
  width: 30px;
  background: url(https://xhosting.co.il/libraries/themes/xhosting/js/masterslider/skins/default/light-skin-1.png);
  background-position: -89px -26px;
  height: 40px;
  cursor: pointer;
  top: 50%;
  left: 30px;
  position: absolute;
  z-index: 110;
}

.loader {
  position: absolute;
  top: 0;
  width: 0;
  height: 10px;
  background: rgba(255, 255, 255, 0.37);
}

.fadeInSlide {
  animation: fadeInSlide 0.5s;
}

@-webkit-keyframes fadeInSlide {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id='slider'>

  <div class='sliderItem itemActive'>
    <div class="welcomeBox row">
      <div class="col-md-4">
        <div class="">
          <h2 class="">ברוכים הבאים ל</h2>
          <h1 class=''>HOST<span>1</span></h1>
        </div>
      </div>
      <div class="welcomeText1 col-md-8">
        <div class=''>
          על מנת לספק את השירותים הללו באיכות הגבוהה ביותר אנו משתמשים בתשתיות האיכותית ביותר הן ברמת החומרה והן ברמת התוכנה. לא משנה על איזה מערכת אתה עובד אם השרת לא איכותי התוצאות בהתאם. לכן אנחנו לא מתפשרים וקונים את הרכיבים הטובים ביותר בשוק.
        </div>
      </div>
    </div>
  </div>



  <div class='sliderItem'>
    <div class="welcomeBox row">
      <div class="col-md-4">
        <div class="">
          <h2 class="">ברוכים הבאים ל</h2>
          <h1 class=''>HOST<span>2</span></h1>
        </div>
      </div>
      <div class="welcomeText1 col-md-8">
        <div class=''>
          על מנת לספק את השירותים הללו באיכות הגבוהה ביותר אנו משתמשים בתשתיות האיכותית ביותר הן ברמת החומרה והן ברמת התוכנה. לא משנה על איזה מערכת אתה עובד אם השרת לא איכותי התוצאות בהתאם. לכן אנחנו לא מתפשרים וקונים את הרכיבים הטובים ביותר בשוק.
        </div>
      </div>
    </div>
  </div>


  <div class='sliderItem'>
    <div class="welcomeBox row">
      <div class="col-md-4">
        <div class="">
          <h2 class="">ברוכים הבאים ל</h2>
          <h1 class=''>HOST<span>3</span></h1>
        </div>
      </div>
      <div class="welcomeText1 col-md-8">
        <div class=''>
          על מנת לספק את השירותים הללו באיכות הגבוהה ביותר אנו משתמשים בתשתיות האיכותית ביותר הן ברמת החומרה והן ברמת התוכנה. לא משנה על איזה מערכת אתה עובד אם השרת לא איכותי התוצאות בהתאם. לכן אנחנו לא מתפשרים וקונים את הרכיבים הטובים ביותר בשוק.
        </div>
      </div>
    </div>
  </div>


</div>





<div class='container'>
  <div class='itemSelectors'></div>
</div>



<div class="clouds"></div>
<div class='ms-nav-prev'></div>
<div class='ms-nav-next'></div>
<div class='loader'></div>