Goodies to Go ™
June 7, 2004–Newsletter #288
This newsletter is part of the internet.com network.
http://www.internet.com
Featured this week:
* Goodies Thoughts – The Client-Server
WWW
* Q & A Goodies
* News Goodies
* Goodies Peer Reviews
* Feedback Goodies
* Windows Tech Goodies
* And Remember This…
Goodies Announcement
The new Beyond HTML Goodies book
is now available!
Go beyond the basics
and learn how the pros add and use dynamic HTML features and advanced
JavaScript techniques. Beyond HTML Goodies demonstrates dozens of new and
different features readers can add to their existing Web pages using HTML and
JavaScript. The book starts with simple text and image tips, such as adding a
clock to a Web page or causing text to appear when the mouse moves over an
image. It gradually builds to more complex tricks, including manipulating forms
or working with cookies behind the scenes. Throughout the book, readers enjoy
Joe’s snappy style and “to the point” discussion of each “goody” in the book.
http://books.internet.com/books/0789727803
Goodies Thoughts – The Client-Server WWW
It’s been a while since I’ve talked about this subject, and
there is an increasing number of questions arriving that are related. Questions
come in like "what JavaScript code do I use to determine if a certain file
exists?" The answer is, of course, "you don’t!" The reason why not is a bit more
interesting.
The World Wide Web is an implementation of a type of computing known as
"client-server" applications. A website is hosted on a Web Server. A Web Server
is an application program, such as IIS or Apache, which resides on a server
computer and delivers up web pages and related data. A server computer is any
one which has been designed not for a user to sit at and use, but to deliver
services to other computers. Frequently, servers are actually multiple computers
working together to provide services, but for the sake of this discussion they
can be considered as one thing.
Servers provide their services to a number of client computers. A client
computer is any one which is obtaining services from a server. A World Wide Web
browser, such as Internet Explorer or Opera, is a program designed to retrieve
web pages and related data from a Web Server. As such, it is a client program to
the Web Server program.
Whew!
Now that we’ve got that clarification out of the way, let’s think about what is
implied.
When a website programmer is putting together a page, they frequently need to
populate it with information that comes from data files on the server and with
pictures from a local directory, etc. To do this, there needs to be program code
that can interact with database manager programs, file management programs and
the like which reside on the server systems. This code is server side code.
Examples of server side code are ASP, PHP, PERL, and the like. The website
programmer is in control of his pages and the supporting databases and files and
so the server side languages provide full support for the interaction between
his pages and those databases and files.
When the page gets down to the Web Browser program, it is now on the client
computer. The website programmer can not be allowed to control the files on that
client computer because they aren’t his or hers to control! There is a need,
however, for the programmer to provide some interactivity between their pages
and the user sitting at that client computer. Client side languages provide that
capability. JavaScript is the most obvious example of a client side WWW
language. It can be used, for example, to validate the data that the user has
typed into a form and provide them the opportunity to correct any errors found
before it is sent back to the serve to be processed.
Flash, Shockwave, Java and the .Net languages extend this capability in various
ways, but none of the client side languages can be allowed to interact with the
files stored on the client computer. Imagine the security problem there would be
if a web programmer could write a program that could look around your computer
when you visit their site! When a programmer discovers some way to do this it is
called a "vulnerability exploit" and is an example of malicious code penetrating
the protections provided by the client computer operating system, browser and
support programs.
HTML includes instructions that can tell the Web Server to do something, such as
including a picture or calling some server side language routine, before
delivering the page to the client. It is also the language that tells the client
browser how to construct the page for display to the user. HTML therefore
includes both Server-Side and Client-Side codes. Other languages, such as the
.Net languages also contain both server side and client side components. When
you are writing code in these languages it is important to know which side you
are writing for. That is a part of the skill required for the effective use of
those languages. JavaScript, however, is a client side language. ASP, PHP and
PERL are server side languages.
To know which is which, think about where the code will be when it runs. Will it
be a part of the process of constructing the page on the server before it is
delivered to the client, or will it be a part of the interaction between the
page in the client browser and the user at their computer?
Realizing which is which seems such a simple and obvious thing to me; until I
have to explain it in writing!!
Thanks for Reading!
– Vince Barnes
Q & A Goodies
Questions are taken from submissions to our Community Mentors. You can ask a Mentor a question by going to
https://www.htmlgoodies.com/mentors.
Q. Im trying to have 2 pictures on the same webpage that flip (rollover)
pictures. I think I have done it as the tutorial said but it gives me 2 pictures
which are like the same flip picture e.g. you can move your mouse over each of
them, but only one flips. The code Im using for this part is as follows:
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!– hide from non JavaScript Browsers
Image1 = new Image
Image1.src = "Home2.bmp"
Image2 = new Image
Image2.src = "Home1.bmp"
function SwapOut() {
document.imageflip1.src = Image2.src; return true; }
function SwapBack() {
document.imageflip1.src = Image1.src; return true; }
// – stop hiding –>
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
<!– hide from non JavaScript Browsers
Image1 = new Image
Image1.src = "AboutUs2.bmp"
Image2 = new Image
Image2.src = "AboutUs1.bmp"
function SwapOut() {
document.imageflip2.src = Image2.src; return true; }
function SwapBack() {
document.imageflip2.src = Image1.src; return true; }
// – stop hiding –>
</SCRIPT>
</HEAD>
<IMG onMouseOver="SwapOut()" onMouseOut="SwapBack()" NAME="imageflip1" SRC="Home2.bmp">
<P>
<IMG onMouseOver="SwapOut()" onMouseOut="SwapBack()" NAME="imageflip2" SRC="AboutUs2.bmp">
</HTML>
A. Here is an example that will work with multiple image flips on the
same page:
<html>
<head>
<title>Multi Image Flip</title>
<SCRIPT LANGUAGE="JavaScript">
function swap(image,imgname)
{
document.images[imgname].src=image
}
</SCRIPT>
</head>
<body>
<CENTER>
<BR>
<BR>
<A HREF="page.html" onMouseOver="swap(‘0.gif’,’img1′)"
onMouseOut="swap(‘1.gif’,’img1′)"><IMG SRC="1.gif" NAME="img1"
BORDER="0"></A><br>
<A HREF="page.html" onMouseOver="swap(‘3.gif’,’img2′)"
onMouseOut="swap(‘2.gif’,’img2′)"><IMG SRC="2.gif" NAME="img2"
BORDER="0"></A><br>
</body>
</html>
Q. I have what seems like a complicated Image Rollover html. Here’s an
example:
Image 1 –> rollover –> becomes Image 1a
but I want two other images on the same page to also change at the same time
Image 1 becomes Image 1a
A. Here is an example of rolling over one image and having another image
change. Take a look at it and you should be able to determine how to have two
images change at the same time.
<html><head><title>Image Flip</title></head>
<body>
<A HREF="#" onMouseOver="document.ani1.src=’imgflip/drum.gif’;document.ani2.src=’imgflip/cherry.gif’"
onMouseOut="document.ani1.src=’imgflip/cherry.gif’;document.ani2.src=’imgflip/drum.gif’";return
true>
<img src="imgflip/cherry.gif" name="ani1" width="100" height="100"
BORDER="0"></A>
<A HREF="#"><img src="imgflip/drum.gif" name="ani2" width="100" height="100"
BORDER="0"></A>
</body></html>
Q. Is there anyway that I can make multiple frames load at a time without
using a form, and using just a regular link?
A. There are a couple of different ways you can accomplish this. The
first example uses "inline JavaScript" to load two frames:
<a href="#" onClick="parent.frame_name1.location=’page1.html’;parent.frame_name2.location=’page2.html’">Click
Me</a>
The second example uses a function that is passed the documents to load when you
click on a link:
<script type="text/javascript">
function Doframes(page1,page2)
{
parent.frame_name1.location=page1
parent.frame_name2.location=page2
}
</script>
<a href="#" onClick="Doframes(‘page1.html’,’page2.html’)">Click Me</a>
In both examples you need to specify the name of the frame that you want the
documents to load in.
Q. I have a small wesbite dedicated to pictures and jokes of my friends,
I wanted to add a slideshow to the page, but have found myself having
difficulties with the code. Could you please help me?
A. Here is a sample of one that I have put together that might help:
<html><head><title>Imange and Link Slide Show</title>
<SCRIPT LANGUAGE="JavaScript">
var a=0
// Enter your images Here along with the directory if need be.
var imgs=new Array()
imgs[0]="owls3.jpg"
imgs[1]="hawks2.jpg"
imgs[2]="pic221.jpg"
imgs[3]="eagle1.jpg"
// Array used for preloading
var myimages=new Array()
// Do the preload
for(i=0;i<imgs.length;i++)
{
myimages[i]=new Image()
myimages[i].src=imgs[a]
}
// Enter your URLS and what you want to go in the ALT property.
// This is so when they mouse over the image, there will be a small description
of the Image or URL.
// Make sure you separate them with an ampersand "&"
// so that the script can separate them out before writing out the link.
var urls=new Array()
urls[0]="http://www.requestcode.com&Requestcode"
urls[1]="http://www.javascriptkit.com&Javascriptkit"
urls[2]="http://www.dynamicdrive.com&Dynamic Drive"
urls[3]="https://www.htmlgoodies.com&HTML Goodies"
// This is the function that displays the images and links.
// You should not have to modify it.
function Doimglink()
{
if(a>imgs.length-1)
{a=0}
if(a<0)
{a=imgs.length-1}
newurls=urls[a].split("&")
if(document.layers)
{
document.mydiv.document.write("<A HREF=’"+newurls[0]+"’><IMG
SRC=’"+imgs[a]+"’ BORDER=’0′ ALT=’"+newurls[1]+"’></A>")
document.mydiv.document.close()
}
if(document.getElementById)
{
elm=document.getElementById("mydiv")
elm.innerHTML="<A HREF=’"+newurls[0]+"’><IMG SRC=’"+imgs[a]+"’
BORDER=’0′ TITLE=’"+newurls[1]+"’></A>"
}
}
// function used to display random image
function rannum()
{
len=imgs.length // how many entries in the array
prev=a // Save the previous image index
a=Math.round(Math.random()*(len-1))
// If the current image equals the previous image,
// add one to get a different image.
if(a==prev)
{a++}
}
window.onload=Doimglink
// In the DIV below you may have to add the top and left properties
// to the style tag to position it correctly in the window.
// You must keep it positions as absolute for it to work in NS4.0+ browsers.
</SCRIPT>
</head>
<body onLoad="Doimglink()">
<CENTER><H1>Manual Slide Show With Links</H1>
<DIV ID=’mydiv’ STYLE="position:absolute;top:120;left:200"></DIV>
<DIV ID=’ctrldiv’ STYLE="position:absolute;top:120;left:100">
<A HREF="javascript:a++;Doimglink()">Next Image</A> <BR>
<A HREF="javascript:a–;Doimglink()">Previous Image</A> <BR>
<A HREF="javascript:rannum();Doimglink()">Random Image</A>
</DIV>
</body>
</html>
[Also, check out https://www.htmlgoodies.com/articles/Powertoys.html — Ed.]
News Goodies
Merrill Analyst Calls for HP Split
[June 7, 2004] An outspoken analyst calls for the break up
of Hewlett-Packard into product or market segments.
Click
here to read the article
eBay Hops Aboard The RSS Train
[June 7, 2004] The online auction giant offers a new way to tell you how
bidding is going on your items.
Click here to read the article
Adobe Launches PDF Platform For Web Services
[June 7, 2004] Adobe moves its portable document format closer to a Web
service.
Click
here to read the article
Search, Integration in the ‘Masala’ Mix For IBM
[June 7, 2004] Big Blue gives its DB2 Information Integrator
software a full revision.
Click here to read the article
Mobile Workstation Goes Mainstream
[June 7, 2004] IBM, Intel and Cadence Design work on a pilot
program to get engineers out of the server room.
Click here to read the article
SBC Joins Wi-Fi World
[June 7, 2004] Wayport’s flat-rate hotspot program that launches with
McDonald’s this year has its first partner, SBC Communications.
Click here to read the article
Oracle, DoJ Gird For Legal Battle
[June 4, 2004] The roots of Oracle’s controversial takeover plan for
PeopleSoft will come to light as the issue heads to trial.
Click here to read the article
Microsoft Double-click Patent Sows FUD
[June 4, 2004] Will you pay Redmond every time you click-click?
Click here to read the article
Oracle Still King of Database Market
[June 4, 2004] But downward price pressure is lurking for all the players in
database software
Click here to read the article
Java Remains Java (For Now)
[June 4, 2004] UPDATE: Are vague comments by one of Sun’s technology
evangelists enough to open source Java? Other Sun folks weigh in.
Click here to read the article
Every week a site is selected for review. Each week,
reviews of the previous week’s selected site are chosen for
publication on the HTML Goodies website.
The current week’s selected site is published in Goodies To
Go and in the Peer Reviews section of the website.
Current contact email addresses for submitting your site and
for submitting reviews are published in Goodies To Go.
If you would like to have your site reviewed, sign up for
the Goodies To Go newsletter in the Navigation Bar on the
left side of this page.
For full details about this program, see
https://www.htmlgoodies.com/peerreviews
Did you ever wish your newsletter was an easy two way communications medium?
Ploof! It now is!
If you would like to comment on the newsletter or expand/improve on something
you have seen in here, you can now send your input to:
mailto:nlfeedback@htmlgoodies.com
We already receive a lot of email every day. This address will help us sort out
those relating specifically to this newsletter from all the rest. When you send
email to this address it may wind up being included in this section of the
newsletter, to be shared with your fellow readers.
Please don’t send your questions to this address.
They should be sent to our mentors: see
https://www.htmlgoodies.com/mentors/
For those who are missing Peer reviews: we are once again
revising the Peer review program in the hopes of creating a
workable solution. The current plan is to move the new Peer
Review pages into place in the new year. All those who have
been selected for reviews in the past will be featured in
the new pages. The new method will make it much easier for
your peers to provide feedback and much easier for us to
handle the publication side of things. "Watch this space!"
It’s coming soon!!
Thanks again for all your feedback!
Top
Windows Tech Goodie of the Week:
Generics In-Depth
http://www.15seconds.com/issue/040525.htm
Although generics are extremely useful, they also seem to
have a certain mystique that cannot be readily explained.
This article hopes to remove that aura of mystery by showing
just how easy it is to use generics and how useful they can
be in many common situations.
*** AND ***
The Magical Mod Function
http://www.asp101.com/articles/steven/mod/default.asp
What does the long division you used to do in school have to
do with programming? The answer to that and many other
questions (including how to make neat HTML tables) are
answered in this look at VBScript’s under-utilized Mod
operator.
Top
And Remember This . . .
On this day in…
1971 US Supreme Court Overturned Paul Cohen Conviction
Paul Cohen had been convicted in California of disturbing the peace.
He had walked into a courtroom on April 26, 1968 (the Vietnam War
era) wearing a jacket with the words "F… the Draft" written on it.
He had removed the jacket as he entered the courtroom itself. When
the matter was brought to his attention, the presiding judge
declined to charge him with contempt, but a police officer who had
seen the jacket arrested Cohen as he was leaving. When convicted, he
was sentenced to 30 days in jail. It was argued that the words were
so inflammatory that it "was certainly reasonably foreseeable that
such conduct might cause others to rise up to commit a violent act
against [Cohen] or attempt to forcibly remove his jacket." By a
narrow 5-4 margin, however, the Judges disagreed, deciding instead
that his right to have the words on his jacket was protected under
the first amendment (freedom of speech), and that "those in the Los
Angeles courthouse could effectively avoid further bombardment of
their sensibilities simply by averting their eyes."
BTW – as a writer (especially), I am a staunch supporter of first
amendment rights. I choose, however, not to use the salient word in
full in this newsletter. I don’t feel that it is needed in order for
me to tell this story.
Today was also the day that in: 1692 Porte Royal, Jamaica,
slid into the sea after an earthquake; 1769 Daniel Boone
began his exploration of Kentucky; 1839 the Hawaiian
Declaration of Rights was signed; 1905 Norway dissolved its
union with Sweden; 1912 US army tested the first airplane
mounted machine gun; 1929 the Vatican City became a sovereign
state; 1930 NY Times agreed to capitalize the "N" in "Negro";
1939 George VI and Elizabeth became the first English King &
Queen to visit the US; 1955 "The $64,000 Question" premiered
on CBS TV; 1971 The Who’s rock opera "Tommy" was performed at
the Lincoln Center in New York City; 1979 rocker Chuck Berry
was charged with tax evasion; 1981 Israel destroyed an
alleged Iraqi plutonium production facility; 1990 Michael
Jackson was hospitalized for chest pains; 1991 singer Donny
Osmond married Michelle Larson;
Born today were: in 1778 English "dandy" George Bryan "Beau"
Brummel; 1848 French painter Paul Gaugin (Eugene Henri);
1896 physicist/Nobel prize winner (1966) Robert Mulliken;
1909 English actress Jesssica Tandy; 1917 singer/comedian
Dean Martin; 1922 boxer/entertainer Rocky Graziano; 1940
Welsh singer Tom Jones; 1944 guitarist Clarence White
(the Byrds); 1946 drummer Bill Kreutzman (Grateful Dead);
1958 musician Prince (Nelson Rodgers); 1971 rapper Mark
Wahlberg;
Thanks for reading Goodies to Go!
