htmlcsstiny-slider

Tiny Slider - Font Awesome control buttons

Instead of text or images, I would like to use font-awesome for the previous & next button on the Tiny Slider plugin.

I tried the following which didn't work:

<div id="controls">
  <!--<button class="previous">Prev</button>-->
  <i class="fas fa-chevron-left previous"></i>
</div>

<div class="slider">
  <article>
    <img src="1.jpg" />
  </article>
  <article>
    <img src="2.jpg" />
  </article>  
</div>

<script type="module">
  var slider = tns({
    container: '.slider',
      controlsContainer: '#controls',
      prevButton: '.previous',
  });
</script>

How can I get this working using font-awesome instead of text or images?

Solution

  • Did you simply tried like that:

    <div id="controls">
  <button class="previous"><i class="fas fa-chevron-left"></i></button>
</div>