dcsimg
www.webdeveloper.com
Results 1 to 2 of 2

Thread: [RESOLVED] fadeIn image replacement issues

Hybrid View

  1. #1
    Join Date
    Jan 2010
    Posts
    1

    resolved [RESOLVED] fadeIn image replacement issues

    I'm woking on a simple image replacement thumbnail gallery using jQuery and am trying to get each image to fadeIn when the thumbnail is clicked. My (stripped down) code looks like this so far:
    <head>
    <script>
    $(document).ready(function(){
    $(".thumbs a").click(function(){
    var largePath = $(this).attr("href");
    var largeAlt = $(this).attr("title");
    $("#largeImg").attr({ src: largePath, alt: largeAlt });
    return false;
    });
    });
    </script>
    </head>
    <body>
    <img id="largeImg" src="img1-lg.jpg" alt="Large image" />
    <p class="thumbs">
    <a href="img1-lg.jpg"><img src="img1-thumb.gif" /></a>
    <a href="img2-lg.jpg"><img src="img2-thumb.gif" /></a>
    <a href="img3-lg.jpg"><img src="img3-thumb.gif" /></a>
    </p>
    </body>

    Can anybody help me with this, or point me to a better solution? I'm trying to ditch my old staple--Flash (like Apple )--for overall end usability.

    I'm trying not to use any jQuery plugins.

    Just a heads up I'm a bit of a n00b with .js and jQuery.

  2. #2
    Join Date
    Oct 2006
    Posts
    939
    The main big image needs to be (two) images placed with style absolute on top of each other.

    I almost surfed on by when I saw "jquery" but, if you are willing to abandon that or better yet can persuade the owner of webdeveloper.com to make a separate forum for jquery, I have a working code that I use all the time for viewing images. It works in IE and FF. If you need something for any other browsers, you'll need to work on it.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles