AnythingSlider a tag problem

[nfxs]

Hi
i’m pretty new to the whole javascript world, so im not quite sure if my question will be a little stupid. Ok, anyway here it is:

I’m using AnythingSlider with images only, something like this:
<ul id=”slider1″>
<li>
<img src=”images/slide-env-2.jpg” />
</li>
.
.
.
</ul>

Now i wanted to add a link to the image, so i added an <a> tag
<ul id=”slider1″>
<li>
<a href=”http://www.somlink.com”&gt;
<img src=”images/slide-env-2.jpg” alt=”” />
</a>
</li>
.
.
.
</ul>

And here i got a problem. When the slider changes from the last image to the first, during the slide (movement) the first image is not displayed (just a with background). Only after the slide finishes the first image apears.
I also noticed that the image is not resizing in the <a> tag. Solved it setting height and width of the img to 100%. But still the white background instead of the first image.

My workaround was adding the link as a onclick to the img and not using the a tag. But i’m not sure if this is the best solution.
Anyway is this a bug? Or am i not suposed to use the <a> tag this way?
Any comments/suggestions/help would be apreciated
Thanks in advance

[nfxs]

Solved it another way. The slider didnt copy correctly the first and last il to the cloned items. It did this:

<LI style=”WIDTH: 800px; HEIGHT: 390px” class=”cloned panel”>
</A style=”WIDTH: 100%; HEIGHT: 100%”>
</LI>
<LI style=”WIDTH: 800px; HEIGHT: 390px” class=panel>
<A style=”WIDTH: 100%; HEIGHT: 100%” href=”http://www.youtube.com&#8221; jQuery1291095351964=”17″>
<IMG alt=”” src=”images/slide-env-2.jpg” width=”100%” height=”100%”>
</A>
</LI>
<LI style=”WIDTH: 800px; HEIGHT: 390px” class=”panel activePage”>
<A style=”WIDTH: 100%; HEIGHT: 100%” href=”http://www.google.com&#8221; jQuery1291095351964=”18″>
<IMG alt=”” src=”images/slide-env-1.jpg” width=”100%” height=”100%”>
</A>
</LI>
<LI style=”WIDTH: 800px; HEIGHT: 390px” class=”cloned panel”>
</A style=”WIDTH: 100%; HEIGHT: 100%”>
</LI>

so i replaced the cloned items with this first and last li items removing the <a> tag:
var firstItem = $(‘#slider1 li:not(.cloned):first’);
var lastItem = $(‘#slider1 li:not(.cloned):last’);

var firstCloned = $(‘#slider1 li.cloned:first’);
var lastCloned = $(‘#slider1 li.cloned:last’);

lastCloned.html($(firstItem).find(‘a’).html());
firstCloned.html($(lastItem).find(‘a’).html());

[Author]

Posts