PDA

View Full Version : trying to add fade effect



ktsixit
10-16-2008, 12:05 PM
Hi
I use a jcarousel in my page as a thumbnail panel, part of a photo gallery. When I click on each carousel items, there's an image appearing next to carousel.
The code is based on changing one image's src.



<div id="photo"><img id="photograph" src="images/gallery/img1.jpg" /></div>


this is the carousel:



<ul id="mycarousel" class="jcarousel jcarousel-skin-tango">

<li><div class="thumbnail"><img src="thumbnail.php?filename=images/gallery/img1.jpg" onclick="document.getElementById('photograph').src ='images/gallery/img1.jpg'"/></div></li>

<li><div class="thumbnail"><img src="thumbnail.php?filename=images/gallery/img2.jpg" onclick="document.getElementById('photograph').src ='images/gallery/img2.jpg'"/></div></li>

<li><div class="thumbnail"><img src="thumbnail.php?filename=images/gallery/img3.jpg" onclick="document.getElementById('photograph').src ='images/gallery/img3.jpg'"/></div></li>

</ul>


What I want to do is add a fadein fadeout effect on the changing <img>. I have tried many things but I can't make it work.

Can you help me? I use jquery-1.2.3.pack

rangana
10-16-2008, 12:32 PM
The current version of jquery is now v 1.2.6 (http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.2.6.min.js&downloadBtn=&#37;3CSPAN%3EDownload%3C%2FSPAN%3E).

If you intend to make the image fade in and out respectively, you can utilize, Jquery's FadeIn() (http://docs.jquery.com/Effects/fadeIn) and FadeOut() (http://docs.jquery.com/Effects/fadeOut) functions.

If you're still stumped, get back, and provide a better picture of your page, or possibly a link.