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 >
Re-Vision.com

projects:
Simple Truths (and Complex Lies)

The Built World
Semblance Portrait Project
Back to Square One
Changing Chicago
Chicago's Reliance Building
US
Along the Mississippi River
The Work of Antoni Gaudí
Graffiti

places:
Morocco 2023
Beecher, Illinois
Iceland 2017
Cuba 2015
Providence, Rhode Island
Greece 2013
Eastern Europe 2013
Israel 2010
Paris, France
Puebla, Mexico 2009
Puerto Rico 2009
Barcelona 2007
Rome, Italy 2006

archive:
Graphics, sounds, and other ancient
items from the dawn of the Web.


FWIW:
Biography

©
Jay Boersma