CODEWITHSUNDEEP
javascriptjqueryhtmlslider
Developer
Developer

Reputation: 2706

Slideshow href not working

I am using http://www.dhtmlgoodies.com/?whichScript=inline_slideshow jquery script

I want to give different different link in every images.

Looks like

<div class="imageSlideshowHolder" id="slideshow1">
    <a href="http://www.learnphp.in">
        <img src="../img.mysite.md/events/danceni/s01danceni.jpg" >
    </a>
    <a href="http://www.google.com">
        <img src="../img.mysite.md/events/danceni/s02danceni.jpg" >
    </a>
</div>

Above code the two images is sliding but last link http://www.google.com is working but http://www.learnphp.in not working.

How to change link with images?

Upvotes: 0

Views: 1546

Answers (2)

Eric Bishard
Eric Bishard

Reputation: 5331

The slideshow works fine, the problem you have is that this javascript is not setup to provide an individual link to each image in the slideshow. As-is it won't work. I'm gonna see if I can crack ope the JS and modify it. If you rollover the image as it changes you will see that the url in your status bar never changes. Only one anchor tag is working and the content is getting switched out inside that element. You will need to assign a link via JS to each image as it changes.

(I see I was a few mins late on the answer) As the user below said, there are other image slideshow libraries that can do this for you with no modification.

This slideshow code is not optimized, you should look for another javascript slideshow that has the features you want. I found this one here on Stack O and there have been a few questions that debug and actually get the links working, here are the link:

jQuery Slideshow

Add Links

And another:

Link individual images

Upvotes: 2

Devesh Kumar
Devesh Kumar

Reputation: 1019

This is because they are putting two images one over another:

<div class="imageSlideshowHolder" id="imageSlideshowHolder">
            <img  src="http://www.dhtmlgoodies.com/scripts/image-slideshow-4/images/image1.jpg" onclick="window.open('http://www.google.com')">
            <img  src="http://www.dhtmlgoodies.com/scripts/image-slideshow-4/images/image3.jpg" onclick="window.open('http://www.learnphp.in')">
</div>

But since the second image is always above first, here it will always open second link.

Either use some different library or change the library for your needs.

A mere google search result gave me following results:

http://wowslider.com/

http://bxslider.com/examples

http://www.slidesjs.com/

Upvotes: 2

Related Questions