Goodies to Go! Newsletter #307

WEBINAR:
On-Demand

Desktop-as-a-Service Designed for Any Cloud ? Nutanix Frame

Goodies to Go (tm)
October 25, 2004 -- Newsletter # 308

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

Featured this week:

* Goodies Thoughts - HTML, XML, XHTML, 4. 4.01 -- Huh?
* Q & A Goodies
* News Goodies
* 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 - HTML, XML, XHTML, 4. 4.01 -- Huh?

There's Hyper Text Markup Language, aka HTML, there's eXtensible Markup Language, aka XML, there's XHTML, Version 4, version 4.01 and so on and on. Huh?!! What are you supposed to do if you are fairly new to web development and unsure of where to start, what to learn and what you should be using for your web pages? What you are supposed to do is turn to your trusty Goodies To Go newsletter and read on!

First, let me assure you that a part of the problem stems not from you, but from the history of the computer industry. You see, the industry has always adhered to the MAMBA principle. Much like its beautiful but deadly, slippery African namesakes, the MAMBA principle can cause choking and similar problems. MAMBA, of course, is More Acronyms Means Better Acronyms. And when more is better, nobody has more than the computer industry! Let's plough through the plethora pervading the web page programming game.

To break it down: the ML is Markup Language. The idea of any markup language is to add decoration to text, such as bold, italic, big, etc. HT is Hypertext and adds in the idea of jumping, or linking, from something on one page to another place on the page or to another page altogether. This gives us HTML - the basic language of web pages. The current version of HTML is 4.01, and this may be the last version as we move into XHTML.

The X means eXtensible. This basically refers to the ability to add new things into it as we move along, without detracting from anything that's already there. XML is the eXtensible Markup Language and is far more complicated that the average web page programmer needs to get into. Then there's the XHTML I just mentioned. This is essentially HTML defined in terms of XML. What that means to a page designer is that by following a few simple rules, they will be able to take advantage of some of XML's extensibility, but without having to spend the next thousand hours learning the ins and outs of XML.

OK! So what should a web page designer know and learn? HTML, that's what! It is important for anybody learning web page design to know HTML because it is the basis of millions of existing web pages from which you can steal --- I mean, obtain inspiration. The current version is 4.01, but that doesn't mean you should ignore the earlier stuff, for exactly the same reason.

XHTML is a great thing to learn too -- once you have your foundation in HTML down. If you don't actually have anything else going on in your life, feel free to learn XML also. It'll help you rise in the world of academia.

Web page building begins with HTML. Start with our tutorials, here:
http://www.htmlgoodies.com/primers/basics.html
or, if you're brand new to it, with the non-technical intro here:
http://www.htmlgoodies.com/nontechintro
You can take a look at the newer stuff once you grasp the basics. It is a complete falacy to think that because there is newer stuff out there, the older stuff has no real merit. There are (at least) a gazillion pages on the web based entirely on the older stuff.

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. My script should add the variables inputed into the text fields and display the sum in the box labeled "TOTAL". The problem is that the box isn't adding the numbers together, it is "grouping" them. For example, there are 7 input boxes (one for each day of the week). If you were to enter the number 1 into each text box and press submit, the "TOTAL" box will return "1111111" instead of "7".

A. Because Javascript treats all values in form fields as text even when they are numbers it will concatenate them together rather than add them. To get the values to add you will have to use the parseInt() or
parseFloat() methods to basically turn them into numbers. Of course you should do some validating to insure they are numbers and not letters. Here are some links on the parseInt() and parseFloat()
methods:
http://www.w3schools.com/wmlscript/lang_parseint.asp?output=print
http://www.w3schools.com/wmlscript/lang_parsefloat.asp
Also here is an example using parseFloat() <html>
<head>
<title>Doing some Math</title>
<script language="JavaScript">
function focusIt() {
window.document.forms[0].elements[0].focus();
}
function calc() {
var b = parseFloat(document.calculator.b.value);
var c = parseFloat(document.calculator.c.value);
var d = b + c;
var ansr = Math.round(d * 100) / 100;
var valu = ansr.toString();
var number = valu.split(".");
if(!number[1])
{
document.calculator.ans.value=valu+".00"
}
else
{
if(number[1].length<2)
{
number[1]="."+number[1]+"0"
document.calculator.ans.value=valu+"0"
}
else
{
document.calculator.ans.value=valu
}
}
}
</script>
</head>
<body onload="focusIt();">
<form name="calculator" onreset="return focusIt();">
<input tabindex="1" type="text" name="b")"><br>
<input tabindex="2" type="text" name="c"><br>
<input tabindex="4" type="text" name="ans"><br>
<input tabindex="3" type="button" value="calculate" onClick="calc()">
<input tabindex="5" type="reset" name="reset">
</form>
</body>
</html>
[Or you could use the eval() function to obtain the numeric value of each input field, as in:
total = eval(field1) + eval(field2)
and son on -- ed]

*** This question was submitted to our Mentor Community. The answer was provided by Bob Conley.

Q. I thought everything on my site was fine, until I viewed it on a flat-screen monitor at a higher resolutions (1280 x 1024). The border that runs along the left side of the page appears again about > of the way to the right, obscuring the text and looking really stupid.

A. The problem is that the background image is too small for the 1280X1024 resolution. The first option is to create the background image larger than it is now so that it will be large enough not to repeat itself in the larer resolution. The other is to use CSS to set the background image instead of setting it in the <BODY> tag.
In the <HEAD> section of the page use the following CSS:
<style type="text/css">
body {
background-color: #FFFFFF;
background-image: url('images/bgimagename.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
}
</style>
This will tell the browser to set the image fixed as it is now so it will not scroll with the rest of the page and to not to repeat it if the resolution is too large.

*** This question was submitted to our Mentor Community. The answer was provided by Jim Young

Q. I am using the script under the So You Want to Resize Your Window, Huh? tutorial and was wondering if I could have it so that when a website visitor clicks on my main image, the re-sized window would pop up rather than them having to only click a text link.

A. This is an example of how you can click on an image and have a window popup that is sized to the width and height of the larger image:
<html>
<head>
<title>Image Pop Up Viewer</title>
<SCRIPT LANGUAGE="JavaScript">
image0=new Image() // preload images large images
image0.src="large0.gif"
image1=new Image()
image1.src="large1.gif"
image2=new Image()
image2.src="large2.gif"
image3=new Image() // preload thumb nail images of large images
image3.src="thumb0.gif"
image4=new Image()
image4.src="thumb1.gif"
image5=new Image()
image5.src="thumb2.gif"
var ImgWin=" "
function imgwin(Imgn) // get width of large image that was pre loaded above
{
w=eval(Imgn+".width")
if(w<100)
{w=100}
h=eval(Imgn+".height") // get height of large image that was pre loaded above
if(h<100) // cannot open window less than 100 by 100 pixels
{h=100}
h=h+25
picgif=eval(Imgn+".src") // build image source
if(ImgWin.open) // if the window is open close it
{ImgWin.close()}
/*Create window and display large image of thumbnail.
If you want to change the position of the window when it pops up change the values for the top and left
properties below in the variable WinProps. The values in top and left are number of pixels from the top
and left of the edge of the screen.
*/
WinProps="width="+w+",height="+h+",location=no,status=no,directories=no,toolbar=no,scrollbars=no,menubar=no,resize=no,top=0,left=0"
ImgWin=window.open("","winimg",config=WinProps);
ImgWin.document.write("<HTML>")
ImgWin.document.write("<HEAD><TITLE>Display
Image</TITLE></HEAD>")
ImgWin.document.write("<BODY marginheight='0' marginwidth='0'
leftmargin='0' topmargin='0' bgcolor='lightyellow'>")
ImgWin.document.write("<CENTER><IMG SRC="+picgif+" BORDER='0'
HSPACE=0 VSPACE=0><BR>")
ImgWin.document.write("<FONT SIZE=-1><A HREF='#'
onClick='self.close()'>Close Me</A></FONT></CENTER>")
ImgWin.document.write("</BODY>")
ImgWin.document.write("</HTML>")
ImgWin.document.close()
ImgWin.focus()
}
</SCRIPT>
</head>
<body>
<CENTER>
<SCRIPT>
/*
If you add more thumbnail images make sure that you include the thumbnail and larger image in the
preload sections above. In the onClick event for the added images make sure you change the value
being passed to match the image name of the large image that matches the thumbnail image. Both
of these must be setup in the image preload sections above.
*/
</SCRIPT>
<BR><BR><BR>
<A HREF="#" onClick="imgwin('image0');return false;"><IMG SRC="thumb0.gif" NAME="img0" BORDER="0"></A>
<BR>
<A HREF="#" onClick="imgwin('image1');return false"><IMG SRC="thumb1.gif" NAME="img1" BORDER="0"></A>
<BR>
<A HREF="#" onClick="imgwin('image2');return false"><IMG SRC="thumb2.gif" NAME="img2" BORDER="0"></A> </CENTER> </body> </html>

*** This question was submitted to our Mentor Community. The answer
was provided by Bob Conley.

Q. (The question was difficult to read, but related to a "fireworks" java applet the writer was trying to use.)

A. I am not sure if your Java applet will do what you want. But I did find a JavaScript that will work similar to what you are looking for:
<html>
<title>Fireworks on click</title>
<head>
<script language="JavaScript1.2">

</script>
</head>
<body OnLoad="initMouseEvents()" bgcolor="#000000">
<div id="sparks">
<div id="sDiv0" style="position:absolute; visibility: hidden;"><font face="arial black" color="red">.</font></div> <div id="sDiv1" style="position:absolute; visibility: hidden;"><font face="arial black" color="yellow">.</font></div> <div id="sDiv2" style="position:absolute; visibility: hidden;"><font face="arial black" color="blue">.</font></div> <div id="sDiv3" style="position:absolute; visibility: hidden;"><font face="arial black" color="red">.</font></div> <div id="sDiv4" style="position:absolute; visibility: hidden;"><font face="arial black" color="orange">.</font></div> <div id="sDiv5" style="position:absolute; visibility: hidden;"><font face="arial black" color="white">.</font></div> <div id="sDiv6" style="position:absolute; visibility: hidden;"><font face="arial black" color="green">.</font></div> <div id="sDiv7" style="position:absolute; visibility: hidden;"><font face="arial black" color="skyblue">.</font></div> <div id="sDiv8" style="position:absolute; visibility: hidden;"><font face="arial black" color="yellow">.</font></div> <div id="sDiv9" style="position:absolute; visibility: hidden;"><font face="arial black" color="white">.</font></div> </div> <font color="#FFFFFF">Click anywhere on the screen.
</font>
</body>
</html>

Top

News Goodies

Fake Red Hat Alert Making Rounds
[October 25, 2004] Unknown attacker sends spam messages with a malicious file masquerading as a Red Hat security update.

Click here to read the article

Bush Signs Tech Tax Break
[October 25, 2004] Law gives U.S. multinationals a one-year reduction on foreign profits from 35 percent to 5.25 percent.

Click here to read the article

PalmOne Launches 'Smarter' Treo 650
[October 25, 2004] PalmOne says its latest smartphone builds on user suggestions.

Click here to read the article

IBM 'Virtually' Upping Storage Ante
[October 25, 2004] Big Blue aims at rivals with improvements to its core storage virtualization products..

Click here to read the article

Avaya Intros IP Telephony On Demand
[October 25, 2004] The communications software firm also pursues enterprise business in the Philippines.

Click here to read the article

Intalio Reaches APEX for Better BPM
[October 25, 2004] The company offers a way to tie business processes and technology with a new business process management suite.

Click here to read the article

HP: UDC Alive and Well
[October 22, 2004] FEATURE: With rumors of its demise exaggerated somewhat, HP's Utility Data Center presses on, albeit redefined.

Click here to read the article

EU to Decide Oracle/PeopleSoft Next Week
[October 22, 2004] Regulators put the probe on the fast track, while Oracle extends its offer yet again.

Click here to read the article

Sender ID For E-Mail Goes Wild
[October 22, 2004] A Canadian ISP plans to go live with Microsoft's e-mail authentication technology next week.

Click here to read the article

Google Soars, Stocks Stumble
[October 22, 2004] Google soared Friday on its first earnings report as a publicly traded company, but the rest of the stock market was battered on weak results from Amazon.com, Microsoft and others.

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/

Thanks again for all your feedback!

Top

Windows Tech Goodie of the Week:

Important Information About an ASP.NET Vulnerability

Microsoft has released a patch that is meant to help protect against a reported vulnerability in ASP.NET. It's recommended that ASP.NET users either install the patch or implement the previously-published workaround to prevent unauthorized Web site visitors from viewing secured content.

http://www.asp101.com/articles/john/kb887289/default.asp

*** AND ***

Business Intelligence with Microsoft SQL Server Reporting Services - Part 1

Adnan Masood discusses Microsoft's comprehensive integrated business intelligence, data mining, analysis and reporting solution: Microsoft SQL Server Analysis services and Microsoft SQL Server Reporting services.

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

Top

And Remember This . . .

On this day in...

1881 Pablo Picasso Was Born

On this day in 1881 in Malaga, Spain, one of the greatest, and probably the most famous artists of the twentieth century was born. He was the son of a drawing professor who steered him towards a career in academic art. In 1900 he went to Paris the exhibit his work on the prestigious Rue Lafitte, where his great success induced him to return to live permanently in Paris. His body of work comprises more than 50,000 paintings, drawings, engravings, sculptures, and ceramics, which he produced over 80 years. Pablo died in 1973 at the age of 91. Prints of some of his work hang in my house -- if you would like to send me originals, email me & I'll make shipping arrangements.

Today was also the day that in: 1415 in the Battle of Agincourt the Welsh Longbow proved superior to an armored knight; 1760 George III ascended the throne of England; 1854 the Light Brigade charged "into the valley of death" at the Battle of Balaklava during the Crimean War; 1945 Japanese surrendered Taiwan to Gen Chiang Kai-shek; 1960 the first electronic wrist watch went on sale (in NYC); 1962 Author John Steinbeck was awarded the Nobel Prize in literature; 1965 the Rolling Stones released "Get Off of My Cloud"; 1968 Yoko Ono announced she was having John Lennon's baby; 1971 Roy Disney dedicated Walt Disney World in Orlando Florida; 1983 US invaded Granada; 1988 ABC News reported on potbellied pygmy porkers' popularity as pets;

Born today were: in 1825 composer Johann Strauss (the younger); 1838 composer Georges Bizet; 1881 artist Pablo Picasso; 1912 singer/entertainer Minnie Pearl [Sarah Ophelia Colley]; 1928 actress Marion Ross; 1928 actor Anthony Franciosa; 1941 Australian singer Helen Reddy; 1949 actor Brian Kerwin; 1963 actress Tracy Nelson; 1967 actress Julia Roberts;