0

We have a slider Revolution slider but it hasn't got arrows on thumbnails. We manually added the arrows but those were unclickable and thumbnails did not scroll.

So, How do I put an arrow image on the thumbnails so when somebody clicks on the arrows the thumbnail behind the arrow gets clicked?

We just want an arrow to show up and does nothing.

Vijya Raghvani
  • 1
  • 2
  • 1
    what have you tried so far ? – Akhil Aravind Aug 13 '18 at 11:07
  • 1
    Where's your code, and what have you tried so far? – BenM Aug 13 '18 at 11:08
  • 1
    Please provide some context information and an example of the image. – Bouke Aug 13 '18 at 11:13
  • 1
    Welcome to SO. Please take a [tour](https://stackoverflow.com/tour) of the [help centre](http://stackoverflow.com/help) to see [how to ask a good question](http://stackoverflow.com/help/how-to-ask) and what types of question are [on topic](http://stackoverflow.com/help/on-topic) for the site – Pete Aug 13 '18 at 11:16
  • Possible duplicate of [Click on an element triggers the click on another element \[JQuery\]](https://stackoverflow.com/questions/21662734/click-on-an-element-triggers-the-click-on-another-element-jquery) – Stender Aug 13 '18 at 11:18
  • You could try give your arrows [`pointer-events:none;`](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events) – Pete Aug 13 '18 at 11:18
  • Welcome! To ask [On Topic question](https://stackoverflow.com/help/on-topic), please read [Question Check list](https://meta.stackoverflow.com/questions/260648/stack-overflow-question-checklist) and the [perfect question](http://codeblog.jonskeet.uk/2010/08/29/writing-the-perfect-question/) and how to create a [Minimal, Complete and Verifiable Example](https://stackoverflow.com/help/mcve) and [take the tour](https://stackoverflow.com/tour). **We are very willing to help you fix your code, but we dont write code for you.** – Dave Aug 13 '18 at 12:03
  • Hi Pete,I tried your code but it doesn't make the thumbnail image behind the arrow clickable. – Vijya Raghvani Aug 13 '18 at 12:49

1 Answers1

0

So, without code to take a look at, it sounds like you are wanting something like pointer-events: none

This property is supported by all modern browsers, including IE11: https://caniuse.com/#feat=pointer-events

On the arrow images you are adding on top of the thumbnails, add that CSS property to them and they will no longer react to clicks, drags, etc. This will allow users to basically click through them. It might look like this in your css:

.left-arrow {
    /** your other css here **/
    pointer-events: none;
}
EmilyH
  • 90
  • 1
  • 9