Results 1 to 5 of 5

Thread: Help with one line of code in Expando

  1. #1
    Join Date
    Apr 2009
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Question Help with one line of code in Expando

    1) Script Title: Expando

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...pandoimage.htm

    3) Describe problem:

    Can anyone tell me what is wrong with this line?
    Code:
    <div class="excontainer start" id="image1"> <a href="index.html"> <img class="expando ex1" img border="1" src="car200.jpg" width="100" height="100" alt="click for info page"></a> 
    </div>
    When I insert the link (index.html via Dreamweaver) the image expands behind the others. If I take the link out it works fine but I need the link to work.
    Hope that someone can help me 'cos this has been driving me nuts for hours.
    A demo can be found here
    http://www.saturdaysquares.com/demo1.htm
    Thank you
    Ross
    Last edited by porkmeister; 04-11-2009 at 01:08 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Whether one element stacks above or below another element when they both occupy some of the same space on the page depends upon its z-index. In the script, that is done here:

    Code:
        if (e.ims[i].d && times > e.ims[i].jump){
         ++e.ims[i].jump;
         im.parentNode.style.zIndex = 3;
         e.ims[i].timer = setTimeout(resize, speed);
        } else if (!e.ims[i].d && e.ims[i].jump > 0){
         --e.ims[i].jump;
         im.parentNode.style.zIndex = 2;
         e.ims[i].timer = setTimeout(resize, speed);
        } else if (!e.ims[i].d && e.ims[i].jump < 1){
         im.parentNode.style.zIndex = '';
         im.style.visibility = 'hidden';
    As you can see, what is being affected is the image's parent node. Which normally would be the the division, but once you introduce the link, the division becomes the parent parent node.

    If all of your images are going to be linked, this may work:

    Code:
        if (e.ims[i].d && times > e.ims[i].jump){
         ++e.ims[i].jump;
         im.parentNode.parentNode.style.zIndex = 3;
         e.ims[i].timer = setTimeout(resize, speed);
        } else if (!e.ims[i].d && e.ims[i].jump > 0){
         --e.ims[i].jump;
         im.parentNode.parentNode.style.zIndex = 2;
         e.ims[i].timer = setTimeout(resize, speed);
        } else if (!e.ims[i].d && e.ims[i].jump < 1){
         im.parentNode.parentNode.style.zIndex = '';
         im.style.visibility = 'hidden';
    Or you could just get rid of the division, move its class designations to the a tag, give the the a tag display:block.

    There are various other things that may be tried, such as using a helper function to find the ancestor node with the appropriate class designation, or changing the zIndex on both the parent and the parent's parent. But if one of the above solutions works for you, I don't see much reason to worry about it.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    porkmeister (04-12-2009)

  4. #3
    Join Date
    Apr 2009
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Thank you John, the first example you gave me worked first time. Much appreciated.
    As I'm new to this, I presume it's ok to muck about with your original script like this?

    Ross

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    As long as the credit remains, it's OK. It would be nice to add something like:

    Code:
    /* Expando-ZV Image Script 2008 - 2009 John Davenport Scheuer
       as first seen in  http://www.dynamicdrive.com/forums/
       username: jscheuer1 - This Notice Must Remain for Legal Use
       with modifications 4/12/09 */
    to the credit, but it's not really necessary.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #5
    Join Date
    Apr 2009
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    It's done
    Thanks once again John
    Ross

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
  •