Bildiğiniz üzere resimler için kaydırma örnekleri  olduğu gibi  content yani Türkçe’si içerik demek olan sitedeki video, yazı, sayfa gibi bölümler  için de  kaydırma  eklentileri mevcut. jQuery LiquidSlider de web sayfasındaki içerikleri kaydırmaya  yarayan bir örnektir. LiquidSlider ile responsive (taryıcıya duyarlı- esnek) slayt web sayfalar tasarlayabilirsiniz. Kategori yada yazılarınız arasında tab benzeri butonlar, rakam yada ok ikonları kullanarak ziyaretçilerinize sitenizde gezinmeyi daha kolay ve eğlenceli bir hale getirebilirsiniz. TouchSswipe.js ile birlikte hazırlandığı için dokunmatik cihazlar üzerinde de sorunsuz bir şekilde çalışmaktadır. Aynı anda hem mobil hemde masa üstü cihazlarda tek bir content slider görevi görüyor.

Kullanım

• Head etiketleri arasına eklemeniz gereken bölümler.

Js ve Css dosya adresleri : 

  <link rel="stylesheet" href="./css/liquid-slider.css">
  <link rel="stylesheet" href="./examples/assets/styles.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="./js/jquery.touchSwipe.min.js"></script>
  <script src="./js/jquery.liquid-slider.js"></script>

 JavaScript : 

  <script>
    $('#main-slider').liquidSlider();
  </script>

•  Body etiketleri arasına eklemeniz gereken bölüm.

Html : 

  <div class="liquid-slider"  id="main-slider">
    <div>
      <h2 class="title">Slide 1</h2>
      <p>Lorem ipsum</p>
    </div>
    <div>
      <h2 class="title">Slide 2</h2>
      <p>Proin nec</p>
    </div>          
    <div>
      <h2 class="title">Slide 3</h2>
      <p>Pellentesque habitant</p>
    </div>
    <div>
      <h2 class="title">Slide 4</h2>
      <p>Proin nec turpis</p>
    </div>
  </div>