Goodies to Go (tm)
January 26, 2004-- Newsletter #269

By Vince Barnes



Goodies to Go (tm)
January 26, 2004--Newsletter #269

This newsletter is part of the internet.com network.
http://www.internet.com
 


Featured this week:

* Goodies Thoughts - Push You, Pull Me
* 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 - Push You, Pull Me


You're familiar, no doubt, with those long saws with a handle at each end, designed to enable two people to cooperate in cutting a log in half. The idea is that while one person is pulling, the other is pushing so that the effort required to achieve the cut is shared between the two. That's great for the people involved since they only have to do half the work each -- except, of course, that the boss will make them do twice as many cuts!

A website can also push and pull. On the website, however, you (the designer) will be doing all the work associated with either the pushing or pulling -- at least as far as writing it is concerned! (You will be able to leave the computers to do the actual pushing and pulling!) Usually you will choose either push or pull, although I suppose there could be reasons to do both at once.

On a website, the two techniques we're talking about here are "Client Pull" and "Server Push". These are both techniques for creating dynamic content. You might want, for example, to provide a price for something that changes every few minutes like a stock, or a message that changes periodically or even commercial ads in a rotation that changes every minute. There are many ways to provide this sort of capability, but Client Pull and Server Push provide a simple mechanism using no more than HTML -- no CGI or PERL needed!

Typically, when a web surfer uses their browser (their client side web program) to navigate to a particular page, the browser identifies the server holding the required page, opens a connection to the server and sends a request for that page to the server. The server then finds the requested page file sends it back to the browser and closes the connection. The browser then displays the page.

Server Push is where the server sends something down to the client browser, but doesn't "complete" it and close the connection. The browser displays it, and waits for the server to close the connection. Before completing the send and closing the connection, the server sends more data to the browser, telling it to display the new data in place of some of that already being displayed. The server can continue to send replacement data until either it chooses to close the connection or the web surfer instructs their browser to close the connection (by clicking "Stop" or by navigating to a new page.)

Client Pull is where to browser has received a page and displayed it, the connection to the server has been closed, but the page contains an instruction that tells the browser to request a fresh copy of data after a specific period of time. When the request is sent out and new data is received it is displayed in place of the old data. This could be a whole new page, or it could be just a part of it -- that depends on the website programmer.

Now that you are clear on what these techniques are, and no doubt can see an immediate need for them, you'll want to know how to use them. Come back next week as I continue with this topic, and you'll find out - instructions will be complete with examples!

 

Thanks for Reading!
 

- Vince Barnes

 

Top

Q & A Goodies

Questions are taken from submissions to our Community Mentors. You can ask a Mentor a question by going to http://www.htmlgoodies.com/mentors.


Q. After reading the JavaScript Primers by Dr. Joe Burns in the HTML Goodies home page I started to create my first own JavaScript homepage. Everything went fine and I managed to make the page the way I wanted. However, I had only checked the results in Microsoft Internet Explorer, and when I in the end checked it with Netscape (6.2) the JavaScript did not work. I think this is very strange since in the beginning of Dr Burns Primers it's written that JavaScript was created by Netscape people. So, have I somehow used a MSIE version of JavaScript? Where is it possible to find information about Netscape compatible JavaScript?
As a JavaScript-example that works in MSIE but not in Netscape my page tries to use SPAN to have another color on the links when the mouse goes over them. So in the beginning of my code it looks like this:
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Map</title>
<STYLE>
SPAN{cursor:hand;}
.onme1{color:purple;}
.offme{color:blue;}
</STYLE>
</head>
<script language="JavaScript">
<!-- Hide from browsers that do not understand Javascript
function getonme() {
el = event.srcElement;
if (el.getAttribute("litUp1")!=null) {
el.className="onme1";
}
}
function getoffme() {
el = event.srcElement;
if (el.getAttribute("litUp1")!=null) {
el.className="offme";
}
}
document.onmouseover = getonme;
document.onmouseout = getoffme;
.
.
.
and so on ...
And then a link looks like this
<a href="argentina.htm"><SPAN litUp1>Argentina</SPAN></a>
So in MIE the link 'Argentina' goes purple when the mouse goes over it but not in Netscape. There are many other functions in my page that works in MSIE but not in Netscape. I would be very grateful for both general information about where to find information about Netscape vs. MSIE JavaScript and/or how to solve my specific problems.

A. First a little history. When Joe wrote his books, Netscape was at version 4 and yes, they did do a lot of work to develop JavaScript. At about the same time, Microsoft wanted Internet Explorer to dominate the web and implemented JavaScript in different ways. The result was that web developers had to cobble together JavaScript that would first detect which browser the visitor was using and then follow a script designed for that particular browser. In other words, developers had to write two scripts where one should have sufficed. At about this time, the World Wide Web Consortium, referred to as the W3C, set a standard for all browsers to follow. One of the casualties was Netscape's support for layers, among others. Mozilla, which was affiliated with Netscape, was developing a W3C compliant browser. Netscape adopted Mozilla features into it's version 6 browsers (We're not sure what happened to 5) and they were significantly more compliant than the current Internet Explorer version 5 as well as Netscape 4. Although cross browser scripting became a little simpler, it was still often required. The latest versions of both browsers, Netscape 7 and Internet Explorer 6 are imminently better at W3C compliance and it is now possible to build a web site with very little cross browser scripting, if any.
This history is very simplistic and the order of events may not be accurate.
Current technology as set by the W3C (http://www.w3.org) uses a combination of HTML, JavaScript, and Cascading Style Sheets (CSS) all following a Document Object Model. The standards as described by the W3C on their web site tend to be very technical and rightfully so. You will find sites such as Mozilla (http://www.mozilla.org) describe these standards in a manner more easily understood as well as providing examples.
I noticed from your meta tags that you are using FrontPage to build your page. Keep in mind that this is a Microsoft product and it will build a page that works in Internet Explorer, but the pages will often not conform to W3C standards and they will sometimes break in other browsers as you have found out.
Now on to your question:
<a href="argentina.htm"><SPAN litUp1>Argentina</SPAN></a>
does not conform to W3C. Argentina is part of a link. To change its color, change the attribute of the link. Try it this way:
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Map</title>
<style type="text/css">
a {color:blue;}
</style>
<script type="text/javascript">
<!-- Hide from browsers that do not understand Javascript
function getonme() {
document.getElementById("litUp1").style.color="purple";
}
function getoffme() {
document.getElementById("litUp1").style.color="blue";
}
//-->
</script>
</head>
<body>
<div>
<a href="argentina.htm" id="litUp1" onmouseover="getonme()"; onmouseout="getoffme()";>Argentina</a>
</div>
</body>
</html>
I looked at the source code for your web page and noticed that the JavaScript is not between the head tags. Try moving it to between the head tags as in my example above. I also noticed that you are relying on tables to position your content. Although it works, a search on the net will return some interesting articles on the use of CSS and div tags for positioning of elements on a page. Use the following key words for your search:
CSS div positioning elements tutorial
Google gave me 2030 results.




Q. Not to be nit-picky, but I noticed in many of the JavaScript examples that are provided in the HTML Goodies newsletter, the following declaration is used:
<script language="javascript">
whereas my understanding is that the proper declaration should be:
<script type="text/javascript">

A. You are not being "nit-picky". I myself am guilty of using the first example where I should be using the second example. I guess old habits die hard.




Q. I'm trying to get some JavaScript running. I'm able to parse two vars to a function, the third one will not work.
This is the function:
<SCRIPT LANGUAGE="javascript">
function nieuw(a,b) {window.open (a, b, config='height=600,width=200,toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, directories=no, status=no')}
</SCRIPT>
It's called by:
<a href=# onclick="nieuw ('bijeenkomsten.html', 'newwindow')">Bijeenkomsten</a>
My goal is to have the screensize set by the calling function, so far i'm unable to do that. I tried by replacing the height and width values by var's, tried to put the height and width into the caller, nothing works. Is it possible to do that or not, if yes how?

A. Actually, you can do it without calling a function. Try this for your code:
<a href="javascript:location='bijeenkomsten.html'; window.open('bijeenkomsten.html','Bijeenkomsten', 'height=600,width=200,top=10,left=10,toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, directories=no, status=no')">Bijeenkomsten</a>
Notice that I added two more attributes, top and left. You can determine where to position the window as well. If you need to use the function, your call is good, except for one possible item. Is newwindow the title of the window? If not, replace newwindow with the title (could it be Bijeenkomsten?)
As for the function itself, remove config=.
Here it is:
<SCRIPT LANGUAGE="javascript">
function nieuw(a,b) {window.open (a, b, 'height=600,width=200,toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, directories=no, status=no')}
</SCRIPT>




Q. Is there a way to use a background image without it repeating? I'd like the bgimg to simply enlarge itself to encompass each visitor's window, instead of doing the tile effect

A. You are not going to be able to get the image to enlarge itself for every resolution. In fact the site you sent has the image repeating. I even looked at it on various resolutions and it repeated in all of them. That being said, you can use some CSS - Cascading Style Sheet - to get an image to only show once as a background. Here is the code you should use:
<style type="text/css">
<!-- body {background-image: url(images/your_image_name.gif); background-repeat: no-repeat;} -->
</style>
Make sure you change the path and image name to suit your situation.





Q. I designed my site to work off of tables, but recently have found that when I make a change to the textstyle, left menu, or any of the background images, I have to go through a very frustrating process of updating all 75 pages on my site. Is there any way to make this process easier, like to have a master page set up that all the rest of the pages can use to follow?

A. To make updating easier in the future you should use dynamic includes and an external style sheet. An "include page" is an actual page but you use some code to tell the browser where to include it on the page. This cannot be done with a static HTML page. The page needs to be dynamic. To do this you would have to change the file extention to ".asp", ".shtml", ".cfm" or another file extension that your server would support. When the browser starts to load the page it "sees" the extension and knows that somewhere in the page there could be some dynamic code that it needs to process.
This tutorial will show you how:
http://www.htmlgoodies.com/beyond/asp.html
For an external style sheet you need to creat a page with your current style sheet and name it with a ".css" file extension. THen in the HEAD section of your HTML your would replace the style sheet you have now with the following line:
<LINK REL=stylesheet HREF="http://www.your.page/style.css" TYPE="text/css">
Use that on all of your pages and all you have to do is update that one style sheet and all of the pages will be affected. For the tutorial on CSS:
http://www.htmlgoodies.com/tutors/ie_style.html




Q. I have used the following script on one of my pages so that which ever screen resolution the user has, they can see the image fully.
<SCRIPT LANGUAGE="JavaScript">
if (screen.width == 640)
{document.write("U can't see this image. Change to a higher resolution!")}
if (screen.width == 800)
{document.write("<IMG SRC=images/800xmusic.jpg>")}
if (screen.width == 1024)
{document.write("<IMG SRC=images/1024xmusic.jpg>")}
if (screen.width == 1152)
{document.write("<IMG SRC=images/1152xmusic.jpg>")}
That all works fine. What I can't get to work or figure out is how to add info (text, links, etc) to the page on top of the image? It just all appears at the bottom of the page under the image.

A. I believe what you want to do is change the "background" image of the body. Try this instead:
if (screen.width == 640) {document.write("<body>")}
if (screen.width == 800)
{document.write("<body background='images/800xmusic.jpg'>")}
if (screen.width == 1024)
{document.write("<body background='images/1024xmusic.jpg'>")}
if (screen.width == 1152)
{document.write("<body background='images/1152xmusic.jpg'>")}
You will need to place this script where your body tag would normally be and remove your body tag. The will replace it. This script will create the body tag with the correct background image that You want based on the screen resolution. Also here are some scripts for changing the background image: http://www.dynamicdrive.com/dynamicindex3/document1.htm
http://www.javascriptkit.com/script/cut176.shtml
 

 

 

 

 

Top

News Goodies


eBay Revs Up Online Car Sales With Acquisition
[January 26, 2004] The online giant plans to spend approximately $152 million to acquire mobile.de, a leading German classifieds website for vehicles.

Click here to read the article


 

 

Windows Mobile Surging in Euro PDA Market
[January 26, 2004] IDC says Windows Mobile systems software surpassed Palm OS-based devices for the first time in 2003.

Click here to read the article

 


 

IBM's Search Ends With Endeca
[January 26, 2004] Big Blue will use the Cambridge, Mass., company's technology to help online shoppers find computers and servers.

Click here to read the article

 

 

Latest "Apprentice" Reject an Online Media Vet
[January 26, 2004] Interactive media exec Sam Solovey reflects on his stint as a reality TV star, and the mega-brand that is Donald Trump.

Click here to read the article



 

Real's Helix Heads to Nordic Region
[January 26, 2004] TeliaSonera will use the Helix mobile platform to power streaming delivery of audio and video content to GPRS and 3G cell phone subscribers in Finland and Sweden.

Click here to read the article

 

 

AOL, CBS Team For Vintage Super Bowl Ads
[January 26, 2004] Cross-media promo amplifies message on both channels.

Click here to read the article

 

 

CA Tailors Backup Software for Windows
[January 26, 2004] The storage player cozies up to Microsoft ever more with the latest iteration of its backup software.

Click here to read the article

 

 


Yahoo! Debuts RSS Beta
[January 26, 2004] A ten-year-old technology may help publishers make an end run around e-mailing updates.

Click here to read the article

 

 


IE Pop-up Blocker Defaults to "Off"
[January 26, 2004] Silence the pop-up death knells. With the beta release of the service pack 2 update for IE, the news is there's no news.

Click here to read the article

 

 

Linux Poised for Desktop, High-End Surge
[January 23, 2004] LinuxWorld touted the progress of open-source in the enterprise app market, but consensus also emerged that low-end desktops and high-end multi-processing systems aren't far behind.

Click here to read the article

 

 

 

 


Top

Goodies Peer Reviews


 

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 http://www.htmlgoodies.com/peerreviews
 

 

 


Top

Feedback Goodies



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 http://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:

 

Database Performance Philosophy

http://www.15seconds.com/issue/040115.htm

Here are some valuable tips on designing databases and applications for
efficient querying.

*** And ***

Colors ASP.NET Sample Code


http://www.asp101.com/samples/colors_aspx.asp

Basically this script just plays around with some colors. That said, it's a
great example of a couple different things. Not only do I use ASP.NET's
HTML controls instead of the Web controls that I normally use, but I also
show you how to apply a style to an HTML control. And if that's not
enough... it's also the first time I've published something that uses the
elusive OnServerClick.

 

 

Top
 
 
 
And Remember This . . .


On this day in...

1995 Russian Nuclear Missiles Almost Launched

On this day in 1995 the Russian early warning system detected a missile launch near Norway. Russian military estimated only minutes remained until impact on Moscow. President Boris Yeltsin, his Defense Minister and his Chief of Staff were notified and the Russian nuclear weapons system was switched into combat mode. Yeltsin's nuclear briefcase and that of his top military commander were activated for the first time ever. Five minutes after launch, Yeltsin was informed that impact would be outside Russian borders. Three minutes later, he was told that the launch was most likely not part of a surprise nuclear attack. By standard launch protocol, Yeltsin would have been only moments from ordering a launch. The missile was a Norwegian scientific mission launch from Spitzbergen. Norway had informed thirty-five countries, including Russia, of the launch two weeks previously, but the Russian Defense Ministry neglected to inform the on-duty personnel at the early warning center. The event raised a lot of international concern over the condition of the Russian nuclear systems.
 


Today was also the day that: in 66 the passage of Halley's Comet (as later named) was recorded for the fifth time; 1788 Captain Arthur Philip formed penal colony at Sidney, Botany Bay, Australia; 1837 Michigan became the 26th US State; 1838 Tennessee became the first State to prohibit alcohol; 1841 Hong Kong was proclaimed a sovereign British Territory; 1871 US Income Tax was repealed; 1875 George Green patented the dental drill; 1905 the 3,106 carat Cullinan diamond was found in South Africa; 1926 inventor John Baird demonstrated his new "television" in London; 1939 first day of filming of "Gone With The Wind"; 1945 Soviet troops reached Auschwitz concentration camp; 1954 groundbreaking at Disneyland; 1972 flight attendant Vesna Vulovic fell 30,000+ feet without a parachute and survived; 1992 the Americans With Disabilities Act went into effect; 1998 President Clinton said "I want to say one thing to the American people, I did not have sexual relations with that woman, Miss Lewinsky"
 


Born today were: in 1871 journalist Warner Fabian (Samuel H. Adams); US General Douglas MacArthur; 1904 Amnestry International co-founder Sean MacBride; 1905 Austrian singer (inspiration for The Sound of Music) Maria Augusta von Trapp; 1907 orchestra leadr Eddie Ballantine; 1918 Romanian President (1967-90)Nicolae Ceausescu; 1922 English comedian Michael Bentine; 1925 actor Paul Newman; 1928 singer Eartha Kitt; 1946 movie critic Gene Siskel; 1958 comedienne Ellen DeGeneres; 1971 actress Tracy Middendorf;
 

Thanks for reading Goodies to Go!

 

Archive Home Page.



Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
  •  
  •  
  •  
Thanks for your registration, follow us on our social networks to keep up-to-date