Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Feb 2008
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts

    need help with JS mouseover/popup

    I'm working on redesigning our site and I'm having a problem with a JS mouseover/popup. Hopefully someone here can help me. Right now, when you mouse over an ad, you get a larger version of the ad in a popup window that appears to the left. What I need to do is make it popup to the right instead.

    You can see the current popup in action here: http://www.stltoday.com/autos

    Go to the Featured Autos section.

    This is the JS that it's using:
    Code:
    function showAdLeft(objname) {
    
      if(document.getElementById) {
        var adobj=document.getElementById('ad'+objname); // the floating ad
        var obj=document.getElementById(objname); // the graphic link
        var objleft=obj.offsetLeft;
        var objtop=obj.offsetTop;
        var objwidth=obj.offsetWidth;
        var objheight=obj.offsetHeight;
        var objxcenter=(objwidth/2)+objleft;
        var objycenter=(objheight/2) +objtop;
        var objybottom=obj.offsetHeight;
        var adobjwidth=adobj.offsetWidth;
        var adobjheight=adobj.offsetHeight;
        var adobjxcenter=adobjwidth/2;
        var adobjycenter=adobjheight/2;
        adobj.style.left=objleft-adobjwidth;
        adobj.style.top=objycenter-adobjycenter;
        adobj.style.visibility="visible"
      }
    }
    
    function showAdRight(objname) {
    
      if(document.getElementById) {
        var adobj=document.getElementById('ad'+objname); // the floating ad
        var obj=document.getElementById(objname); // the graphic link
        var objleft=obj.offsetLeft-150;	 //Make adjustment for being in right column
        var objtop=obj.offsetTop;
        var objwidth=obj.offsetWidth;
        var objheight=obj.offsetHeight;
        var objxcenter=(objwidth/2)+objleft;
        var objycenter=(objheight/2) +objtop;
        var objybottom=obj.offsetHeight;
        var adobjwidth=adobj.offsetWidth;
        var adobjheight=adobj.offsetHeight;
        var adobjxcenter=adobjwidth/2;
        var adobjycenter=adobjheight/2;
        adobj.style.left=objleft-adobjwidth;
        adobj.style.top=objycenter-adobjycenter;
        adobj.style.visibility="visible"
      }
    }
    
    function hideAd(objname) {
      if(document.getElementById) {
        adobj=document.getElementById('ad' +objname);
        adobj.style.visibility="hidden"
      }
    }
    
    // -->
    </script>
    I'm assuming this should be an easy fix, but I have no idea where to start. Again, if anyone can help, I would greatly appreciate it. Thanks!

    Steve

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,247
    Thanks
    203
    Thanked 2,556 Times in 2,534 Posts
    Find where the function showAdLeft() is called and replace with showAdRight().

  • #3
    New Coder
    Join Date
    Feb 2008
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    Find where the function showAdLeft() is called and replace with showAdRight().
    That's what I thought when I first looked at the code. But after closer inspection, they both send the popup to the left. The difference is that showAdRight() sends it over an additional 150px to allow for the popup to appear in the same place as the one in the left column on that row...

  • #4
    New Coder
    Join Date
    Feb 2008
    Posts
    81
    Thanks
    2
    Thanked 0 Times in 0 Posts
    OK, now that we've "semi-launched" the new site, I can post a URL so you can see the issue I'm having in the full context of the page.

    Go to http://www.stltoday.com/autos and check out the Featured Rides module. You'll see 2 rows of 2 ads.

    When you mouse over an ad, the popups currently go to the left. What I would to do is have them go to the right instead. More specifically, I'd like them to appear 25px to the right of the ad in the right column. So if you mouse over the ad in either column, it needs to appear 25px to the right of the ad in the right column.

    Any help you can provide will be great appreciated... thanks!!

    Steve
    Last edited by SteveMTNO; 05-07-2008 at 10:36 PM.


  •  

    Posting Permissions

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