Ninja Slider / Posts /

Need links inside ninja slider

2

I have tried to use a href tag eg: <a href="site link"> Click Here </a> inside the Ninja Slider.

It is not working if I add links inside the slide images ( I know it is illegal to nest anchor tags such as <a href="#"><a href="/">link</a></a>). So how can I make the link work?

Rohan G  8 years ago   viewed: 9714    

5 Answers

-1

Please read the "Scalable image, lazy load" section in the page Ninja Slider. You can use other tags instead of <a> for the slide images. Then you can add link markup inside the image.

Another approach is adding the link markup outside the image markup, such as adding the link inside the caption layer. 

Milo   8 years ago
1

Below is what we have used but the click option does not work, we are using a licensed copy!Are we doing something wrong?

<a href="/"><img  class="ns-img" src="1.jpg"></a>

Rohan   8 years ago
2

As <a></a> cannot be nested within another <a></a>, you should take one of the following approaches:

  1. Use <span> tag for the slide image. Then you can wrap the image with a link:<a href="(the url)"><span class="ns-img" style="background-image:url(1.jpg);cursor:pointer;"></span></a>
  2. or use img tag directly for the slide image:<a href="(the url)"><img class="ns-img" src="1.jpg" style="cursor:pointer;"></a>
  3. or create a hyper link inside a caption. Take the demo 1 as an example, you can update the cation HTML to:<div class="caption"><a href="http://www.google.com/">Google</a> will help</div>

Note:

  • For the 1st or the 2nd approach, we need to add the "cursor:pointer;" style to the slide image, as shown in green color
Milo   8 years ago
0

Dear milo, I have tried all of your suggestions to make a link but nothing worked. Only the first one works but with this the link works but the image doesn't appear. Can you please solve it? thanks

Sandro
  8 years ago
0

The only scenario that makes it not working is that, as far as I can imagine, your HTML code contains syntax errors such as a tag is not properly closed.

Milo   8 years ago

   

Your name*
Password
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question:
▲