SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    May 2007
    Posts
    106
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    using .load() with .fadeIn (jQuery)

    developing a portfolio, on the left side of the container are preview images the end user can click on, then on the right side of the wrapper is a <div> where all the information on that project/client will be displayed.

    I've been trying to get the informational content (in the <div>) but haven't had any luck.

    When the user clicks the preview image, it calls "onClick=entry_info(id)".

    the id is placed in by PHP, and it comes from a database.

    Here's what the entry_info function looks like:
    Code JavaScript:
    function entry_info(id) {
    		$('#port_content').fadeIn('normal', function() {
    		$('#port_content').load('../wp-content/themes/MattVanBlaricom-Default/php/port_entry_display.php?id='+id)
    		});
    }

    #port_container is the <div> that will present all the information.

    if you'd like a link... here it is: http://wordpress.mattvanblari.com/portfolio/

    for some reason it's not fading in... but just appearing..

    any ideas?

  2. #2
    SitePoint Wizard bronze trophy Immerse's Avatar
    Join Date
    Mar 2006
    Location
    Netherlands
    Posts
    1,661
    Mentioned
    7 Post(s)
    Tagged
    1 Thread(s)
    The order is wrong - first you're doing a fadeIn on visible content (so you see nothing) and then you're loading the content.

    Code javascript:
    function entry_info(id) {
     
        $('#port_content').fadeOut('normal', function() {
            $('#port_content').load('../wp-content/themes/MattVanBlaricom-Default/php/port_entry_display.php?id='+id, function() {
                $('#port_content').fadeIn('normal');
            })
        });
     
    }


    I've changed the function a little (and it's untested). But what it does now is:
    1 - fade the #port_content div out
    2 - load new content into the div
    3 - fade the #port_content div back in


    Hopefully that will work a little better!

  3. #3
    SitePoint Zealot
    Join Date
    May 2007
    Posts
    106
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Works great!

    Thanks!

    (Sorry to hear about the netherlands losing the cup... I was rooting for um. But I am glad that I got the free book from sitepoint . Obvioiusly I need the help (with jQuery that is..))

  4. #4
    SitePoint Wizard bronze trophy Immerse's Avatar
    Join Date
    Mar 2006
    Location
    Netherlands
    Posts
    1,661
    Mentioned
    7 Post(s)
    Tagged
    1 Thread(s)
    Well, I would have prefered NL to win, but the book is pretty nice! I prefer it to the other one. So I guess that's a silver lining


Bookmarks

Posting Permissions

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