Friday, 9 August 2013

I would like to replace or cover an image with another image

I would like to replace or cover an image with another image

I've got a problem with a slider, it's pretty heavily modified but I'm
stuck with one problem. I'm using images as links relevant to particular
slide numbers as follows:
<a class="nivoLink" rel="1" href="#"><img src="img/choneoff.png"></a>
<a class="nivoLink" rel="2" href="#"><img src="img/chtwooff.png"></a>
<a class="nivoLink" rel="3" href="#"><img src="img/chthreeoff.png"</a>
<a class="nivoLink" rel="4" href="#"><img src="img/chfouroff.png"></a>
<a class="nivoLink" rel="5" href="#"><img src="img/chfiveoff.png"></a>
I've also got a bit a bit of Javascript/jQuery which adds a class to each
link when the corresponding slide is active:
var slideNo;
function selectedSlide() {
var offSet=2;
var totSlides = jQuery('.nivoSlider').data('nivo:vars').totalSlides;
if (slideNo) {
jQuery('.nivoLink[rel=' + slideNo + ']').removeClass('currentLink'
+ slideNo)
}
else {
offSet = 1;
}
slideNo = jQuery('.nivoSlider').data('nivo:vars').currentSlide + offSet;
if (slideNo == totSlides + 1)
slideNo = 1;
if (!slideNo)
slideNo = totSlides;
jQuery('.nivoLink[rel=' + slideNo + ']').addClass('currentLink' +
slideNo);
};
So I'm looking to replace the image with another image. I've tried setting
them as background images and using z-index but doesn't seem to be
working. Site link is involutionstudios.net/control
Thanks in advance

No comments:

Post a Comment