Webwork
/
JavaScript Tool Kit #2

Another collection of short, simple JavaScript snippets that do various useful things.

Alert Message

Source:
<script language="JavaScript"> function alertUser() { alert("You just rolled the cursor over an Event Attribute.") } >/script>

<a href="javascript:;" onMouseOver="alertUser()">Roll over this.</a>
Web page:
Roll over this.

Confirm Box

Source (click to select all):
Web page:

Prompt Box

Source (click to select all):
Web page:

Centered Popup

Source:
<script>
function PopupCenter(pageURL, title,w,h) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
}
</script>

<a href="javascript:void(0);" onclick="PopupCenter('http://www.colum.edu', 'myPop1',850,400);">CLICK TO OPEN POPUP</a>
Web page:
CLICK TO OPEN POPUP

Centered Popup with Thumbnails

Source:
<script>
function PopupCenter(pageURL, title,w,h) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
}
</script>

<a href="javascript:void(0);" onclick="PopupCenter('daughter-of-dr.-jekyll.jpg', 'myPop1',400,520);"><img src="daughter-of-dr.-jekyll-thumb.jpg" width="96" height="128" alt="daughter-of-dr.-jekyll-thumb"></a>

<a href="javascript:void(0);" onclick="PopupCenter('girls-school.jpg', 'myPop1',400,520);"><img src="girls-school-thumb.jpg" width="96" height="128" alt="girls-school-thumb"></a>

<a href="javascript:void(0);" onclick="PopupCenter('outside-the-law.jpg', 'myPop1',400,520);"><img src="outside-the-law-thumb.jpg" width="96" height="128" alt="outside-the-law-thumb"></a>

<a href="javascript:void(0);" onclick="PopupCenter('untamed-fury.jpg', 'myPop1',400,520);"><img src="untamed-fury-thumb.jpg" width="96" height="128" alt="untamed-fury-thumb"></a>
Web page:
daughter-of-dr.-jekyll-thumb girls-school-thumb outside-the-law-thumb untamed-fury-thumb

Popup with Maximum Screen Size

Source:
<a href="http://www.colum.edu/" onclick="window.open(this.href, 'child', 'height=' + screen.height + ',width=' + screen.width + ',fullscreen'); return false">Columbia College Chicago</a>
Web page:

Previous | Webwork Table of Contents | Next >
photographs:

Semblance Portrait Project
The Built World
Greece
Hungary/Czech Republic
Poland
Graffiti
Simple Truths
Israel


Paris
Puebla, Mexico
Spain
Along the Mississippi
Italy
Santa Fe
The Reliance Building
Providence
archive:

Webwork
The Web Page from Hell
The Portals Project
Transition
Insights
Internet Spelling Guide
Ape Silverback (Primate Ruminations)
Revenge of the Movie Poster
GIFs 4 Us
The Web Rules
Webpix
Backgrounds 4 Us
Webpaper
Digital Sketches
Fonts
Sounds
© Jay Boersma