popup window close any where on window onclick

**Girard Ibanez** · 07-31-2006, 11:36 PM

Thanks John ....No Tweaking necessary .... works

Now if only I can learn how to do this JS stuff. Two days of fiddling was well worth the wait.

Also, Thanks to Burt for all your efforts ... your contribution to my solution will work for the other parts of the site.

Problem solved //end//

**Girard Ibanez** · 07-31-2006, 11:58 PM

Update .... Dang IE does not follow the script. Fire Fox ok ...

Here's the link .. Click on the image ... then click on image to close ...ie no work ... ff works

www.team-raptor.net/girard/myraptor

Thanks again for the assistance.

Enjoy my site while you're there ... construction on going.

girard

**jscheuer1** · 08-01-2006, 03:25 AM

Change:

Code:

onclick=function(){self.close();};

to:

Code:

document.onclick=function(){self.close();};

Sorry about that.

**Girard Ibanez** · 08-01-2006, 04:11 AM

John,

Don't be sorry .....

without your help I would not be this much closer to the way I want it.

Thanks again.

**Girard Ibanez** · 08-01-2006, 07:08 PM

John,

Is there a way to set the new document window such that it can be set to the image size. Some of the images are not to proportion as called out in the html's href.

May I screw the script up since I remove the randow lines of js.

Some images are different sizes so I donot know how to address.

www.team-raptor.net/girard/myraptor

**jscheuer1** · 08-01-2006, 10:27 PM

Well, the size of the window (and therefore the image in it) is set here (green):

Code:

NewWindow(this.href,'mywin','520','680','yes','center')

Width is followed by height. The idea is to set these to image width+20 and image height+20.

However, if you do not want to pass the image size in this way, you can remove the red parts from these two lines in the function I wrote, as shown below:

Code:

win.document.write('<body bgcolor="#dddddd"  text="#000000" style="margin:10px;padding:0;overflow:hidden;">');
win.document.write('<img width="'+(w-20)+'" height="'+(h-20)+'" galleryimg="no" src="'+mypage+'">');

**Girard Ibanez** · 08-02-2006, 04:38 AM

John,

You R da man .... Thanks again.

I post this on another topic but no solution to my question. Can I achieve a left column hyper link nav to highlight/bold the text when the page is in the current view.

The look I am looking for is like this url's left nav:
http://www.w3schools.com/css/css_text.asp

Here's my URL and the left nav is also a duplicate of the top horiz nav {building tips >> raptor 50V2 >> collective servo }

http://team-raptor.net/girard/myrapt...servo_tip.html

I want to obtain a highlighted/bold text on the left column so that it show the viewer the current page. Kinda like a bread crumb effect.

Thanks again.

PS.

What site/books do you recommend to learn JS.

**jscheuer1** · 08-02-2006, 08:05 PM

Since it appears that this left nav is on each page individually, why not just style the appropriate choice on each page as desired? That is how breadcrumb navs are usually done anyway.

**Girard Ibanez** · 08-02-2006, 11:30 PM

I thought about that but each page is updated by a single nestled template.

The idea was to update the href links via the the nestle template vice going through all the pages to make a single change.

Unless I am missing what your are suggesting.

Girard

**jscheuer1** · 08-03-2006, 07:28 AM

Well, you could make up a script that tests the location.href and then updates style based upon that. For example:

Code:

<style type="text/css">
.onthispage {
font-weight: bold;
text-decoration:underline;
}
</style>

<script type="text/javascript">

function hlightpagelink(){

var url=location.href

if(url.indexOf('home.htm')>-1)
document.getElementById('homelink').className='onthispage'
if(url.indexOf('about_us.htm')>-1)
document.getElementById('aboutlink').className='onthispage'
}

if ( typeof window.addEventListener != "undefined" )
    window.addEventListener( "load", hlightpagelink, false );
else if ( typeof window.attachEvent != "undefined" )
    window.attachEvent( "onload", hlightpagelink );
else {
    if ( window.onload != null ) {
        var oldOnload = window.onload;
        window.onload = function ( e ) {
            oldOnload( e );
            hlightpagelink();
        };
    }
    else
        window.onload = hlightpagelink;
}
</script>

In the above example, the page home.htm would set the class name of a link with the id of homelink to onthispage so that it would follow the styles set out for that class. If the page was about_us.htm, a link with the id of aboutlink would get this treatment.

The links that would be on each page for this example could look like so:

HTML Code:

<a href="home.htm" id="homelink">Home</a><br>
<a href="about_us.htm" id="aboutlink">About Us</a><br>

You would have to make up a test for each page similar to the two red ones in the above script and coordinate those with an assigned id for that link as shown in my two examples.

Thread: popup window close any where on window onclick

Thread Tools

Search Thread

Bookmarks

Bookmarks

Posting Permissions