The forums have permanently moved to forum.kirupa.com. This forum will be kept around in read-only mode for archival purposes. To learn how to continue using your existing account on the new forums, check out this thread.

Results 1 to 1 of 1

Thread: Javascript Popup situation

  1. #1

    Javascript Popup situation

    Ive been working with this code to get a info-pic to pop up on my site.
    Thing is the default settings of the code is that the popup posts itself directly to the bottom of the linked text/image.
    What i would like to know is if any of you can pinpoint what id need to change to get the popup to pop to the right and be centered on the page.

    Code:
    <SCRIPT TYPE="text/javascript"><!--
    /* Script by: www.jtricks.com
     * Version: 20060314
     * Latest version:
     * www.jtricks.com/javascript/window/box.html
     */
    // Moves the box object to be directly beneath an object.
    function move_box(an, box)
    {
        var cleft = 0;
        var ctop = 0;
        var obj = an;
     
        while (obj.offsetParent)
        {
            cleft += obj.offsetLeft;
            ctop += obj.offsetTop;
            obj = obj.offsetParent;
        }
     
        box.style.left = cleft + 'px';
     
        ctop += an.offsetHeight + 8;
     
        // Handle Internet Explorer body margins,
        // which affect normal document, but not
        // absolute-positioned stuff.
        if (document.body.currentStyle &&
            document.body.currentStyle['marginTop'])
        {
            ctop += parseInt(
                document.body.currentStyle['marginTop']);
        }
     
        box.style.top = ctop + 'px';
    }
     
    // Shows a box if it wasn't shown yet or is hidden
    // or hides it if it is curre
    function show_hide_box(an, width, height, borderStyle)
    {
        var href = an.href;
        var boxdiv = document.getElementById(href);
     
        if (boxdiv != null)
        {
            if (boxdiv.style.display=='none')
            {
                // Show existing box, move it
                // if document changed layout
                move_box(an, boxdiv);
                boxdiv.style.display='block';
            }
            else
                // Hide currently shown box.
                boxdiv.style.display='none';
            return false;
        }
     
        // Create box object through DOM
        boxdiv = document.createElement('div');
     
        // Assign id equalling to the document it will show
        boxdiv.setAttribute('id', href);
     
        boxdiv.style.display = 'block';
        boxdiv.style.position = 'absolute';
        boxdiv.style.width = width + 'px';
        boxdiv.style.height = height + 'px';
        boxdiv.style.border = borderStyle;
        boxdiv.style.textAlign = 'right';
        boxdiv.style.padding = '4px';
        boxdiv.style.background = '#FFFFFF';
        document.body.appendChild(boxdiv);
     
        var offset = 0;
     
        // Remove the following code if 'Close' hyperlink
        // is not needed.
        var close_href = document.createElement('a');
        close_href.href = 'javascript:void(0);';
        close_href.onclick = function()
            { show_hide_box(an, width, height, borderStyle); }
        close_href.appendChild(document.createTextNode('Close'));
        boxdiv.appendChild(close_href);
        offset = close_href.offsetHeight;
        // End of 'Close' hyperlink code.
     
        var contents = document.createElement('iframe');
        contents.scrolling = 'no';
        contents.frameBorder = '0';
        contents.style.width = width + 'px';
        contents.style.height = (height - offset) + 'px';
     
        boxdiv.appendChild(contents);
     
        move_box(an, boxdiv);
     
        if (contents.contentWindow)
            contents.contentWindow.document.location.replace(
                href);
        else
            contents.src = href;
     
        // The script has successfully shown the box,
        // prevent hyperlink navigation.
        return false;
    }
    //--></SCRIPT>
    If you can too, figuring the 'close' feature to be seletec on the image alone [with no added text] would be cool.

    to get an idea of my situation, heres the page: http://www.dolphinencounters.com/2index.htm - its the image with the guy wearing a hat... a cowboy hat.
    Last edited by Ajax-45; March 30th, 2006 at 04:23 PM.

Thread Information

Users Browsing this Thread

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

Posting Permissions

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

Home About kirupa.com Meet the Moderators Advertise

 Link to Us

 Credits

Copyright 1999 - 2012