Goodies to Go ™
May 19, 2003–Newsletter #233
This newsletter is part of the internet.com network.
http://www.internet.com
Featured this week:
* Goodies Thoughts – Table Elegance
* Q & A Goodies
* News Goodies
* Goodies Peer Reviews
* Feedback Goodies
* And Remember This…
Goodies Announcement
Just in case you missed
it before, 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 – Table Elegance
It’s a welcome invitation indeed when it’s heard: "come, join me at my table."
In the "normal" world, that would be an invitation to dine, but in the more
exciting world of a web programmer <g> the finest, the most elegant tables are
all defined by HTML! We have talked before about tables, but with all the
wonderful solutions they provide it is hardly surprising that we return to
talking of them once again. Questions continue to come in to the HTML Goodies
Mentors (see
https://www.htmlgoodies.com/mentors) the answers to which involve tables.
A table is an arrangement of things in rows and columns. At the intersection of
a row and a column is a rectangle called a cell. In theory, a table could be one
row deep and one column wide, but the single cell table so created would be of
limited value. When you have more than one row, or more than one column, the
true value of the table reveals itself.
It is amazing how many times we are asked "how do I put two pictures side by
side? The browser puts them on on top of the other no matter what I do."
Browsers will do that. To force the pictures to appear side by side, you would
create a table having a row and two columns and place a picture into each of the
two cells thus defined.
A table cell can contain pretty much anything. One thing it is sometime very
useful to place into a table cell is a table. Nesting them in this way allows
for some very interesting layout possibilities for your page. Some people
struggle with frames to lay out their pages. Frames do have their place, of that
there is little doubt, but for the finer points of layout, the table rules!
Remember that frames slice your viewing space from top to bottom or from side to
side. A table can occupy any portion of your viewing space. There are, of
course, iframes, which can float in the middle of the page, but trust me, this
is not the easy way to finesse your layout!
A table’s definition allows you to specify its width or height, either as a
percentage of available space or as a number of pixels. You can define a
background for the table as a color or a picture; you can specify characters of
a border, if you wish to have one; you can specify its location to be fixed at a
certain point on the page; you can specify a certain amount of white space to be
between the cells or within the borders of each cell. You can also specify most
of these attributes for each cell within your table.
Such flexibility is what makes the table a powerful weapon indeed in the web
coder’s arsenal. If you want to see how each of these things is accomplished,
check out the tutorial at
https://www.htmlgoodies.com/tutors/tbl.html
Now take a look back at Goodies To Go #231 (see
https://www.htmlgoodies.com/letters/231.html) The example included in that
issue makes some outstanding use of tables. You can see them in action at
http://www.upperlowerbury.com/menusample.asp In this example, there
are definitions in use that span multiple files. The contents of each of the
files are included in the footnotes of that issue. To see the resulting tables
as a whole, use "view source" on the sample page, and cut and paste the code
into your wysiwyg editor of choice. The use of tables is quite cunning, and its
worth following through until you see how it all fits together.
Now, to me, a table laid out with fine silver and Noritake is OK, but relatively
unimportant, no matter what the menu. But a table laid out across files that
holds a menu in a fixed location and spreads out content so that it’s all easy
to get to — now that’s impressive!
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. I have a side menu that is part of the whole page, and was wondering
if there is a way to change the menu with out having to go through each page,
but with out using frames.
A. With out frames your best bet would be a Server Side solution such as
PHP. To do it with JavaScript would involve some heaving coding in an external
JavaScript that could get rather ugly. With PHP you could place the HTML and or
JavaScript code in a separate file and then just include it in every page you
want to display it.
[Check out Goodies To Go #231 at
https://www.htmlgoodies.com/letters "Including Easy Maintenance" — it
includes a soup to nuts answer to your question! -Ed]
Q. I would like to start a web design company, but I don’t want to be
tied down to html editors. I can manipulate open source websites, such as the
ones found on www.oswd.org but I would like to
be able to open up notepad and go to work designing my own. I thought maybe I
could get some answers here.
A. I am not sure what you are looking for. You can certainly use Notepad
to create web pages. You just have to know HTML. You would have to have a
program for images if you are going to edit and/or create images for your pages.
An HTML editor is just a tool to make it easier to code a page. If you were to
type every line of code it would take you a lot longer than if you used an
editor. I’m not saying to rely on an editor completely. I have to edit/tweak my
HTML manually all of the time. If you are just starting out trying to learn HTML
you came to the right place. HTMLGoodies.com will get you well on your way.
Q. I uploaded some files via ftp and everything seemed ok, but when i go
to look at the site I get the old test pages not the new pages. I have several
machines all connecting to the internet via the same adsl router. I have cleared
out the browser cache and history on all the machines, rebooted them, connected
to the website and I’m still getting the old pages. But, if I use
www.anonymizer.com I get the new
pages!
A. You mention that you are using an "adsl setup". This has been known to
cause caching problems. In the settings for your adsl modem look for the "webproxy"
setting. Make sure that there is NOT a check in the box. If there is, "un-check"
the box and look at the website again. You may or may not have to re-boot after
making this change.
Q. I help maintain a small site for a non-profit and am pretty much
self-taught (with the help of Goodies!). I can’t figure out how to open a new
window launched from a javascript. It’s a small script, coupled with a form with
dropdown links. Like "choose the issue of the newsletter." After selecting the
issue, the PDF launches, but I want it to launch in a new window. I’d like to do
the same with the top navigation on the page, so all PDFs open in a new window.
Every time I try to incorporate /target = _blank or "resource window", it
doesn’t work like in HTML. (Code provided)
A. One of the problems you were having is that you were trying to use the
target property with a drop down. That will not work. I have modified your
code and was able to get it to work. Here is is:
<html>
<head>
<title>Drop Down New Window</title>
<script language="JavaScript">
function LinkUp(frmobj)
{
if(document.DropDown.DDlinks.selectedIndex!=0)
{
loc=document.DropDown.DDlinks.options
[document.DropDown.DDlinks.selectedIndex].value
NewWin=window.open(loc,"win1",config="width=400,height=500")
}
}
</script>
</head>
<body>
<form name="DropDown">
<select name="DDlinks">
<option value="">Select One</option>
<option value="http://www.wheatlandsalem.org/newsletters/May03.pdf"> May
2003</option>
<option value="http://www.wheatlandsalem.org/newsletters/Apr03.pdf"> April
2003</option>
<option value="http://www.wheatlandsalem.org/newsletters/Feb03.pdf">
February 2003</option>
</select>
<input type="BUTTON" value="View" onClick="LinkUp()"> </form> </body> </html>
You will notice that in the window.open statement in the JavaScript function I
set the width and height of the window. You can also set other properties such
as whether to allow the status bar to display, the location bar, etc. I believe
if you search the HTML Goodies web site there is a tutorial on opening new
windows. Finally I also came up with an alternative that does not use a button
to activate the script that opens the selection in a new window.
<html>
<head>
<title>Drop Down New Window</title>
<script language="JavaScript">
function LinkUp(selopt)
{
if(selopt!="") // if variable is not empty then open window
{
NewWin=window.open(selopt,"win1",config="width=400,height=500")
}
}
</script>
</head>
<body>
<FORM NAME="DropDown">
<SELECT NAME="DDlinks" onChange="LinkUp(this.options [this.selectedIndex].value)">
<option value="">Select One</option>
<option VALUE="http://www.wheatlandsalem.org/newsletters/May03.pdf"> May
2003</option>
<option VALUE="http://www.wheatlandsalem.org/newsletters/Apr03.pdf"> April
2003</option>
<option VALUE="http://www.wheatlandsalem.org/newsletters/Feb03.pdf">
February 2003</option>
</SELECT>
</FORM>
</body>
</html>
The above example uses the onChange event in the select tag to perform the
function LinkUp() when a selection is made. It also passes along the value of
the option that was selected to the function. The term "this" refers to the
formelement and its properties such as the elements name, type, etc.
Q. This was posted In the recent Goodies newsletter (5/12/03):
Q. I found a script that disallows the right clicking to "view source" which is
great.. however is there another code that disallows the ability to click on the
"Source" option under the View Toolbar?
A. There is no way to stop them from viewing the source using the "view source"
option.
However, the selected peer review winner of 4/28/03,
http://atlantacelticfestival.org
reveals this message when you click on view source:
<!– YOU ARE NOT AUTHORIZED TO VIEW THIS PAGE –>
Am I just misinterpreting what is being said here? Could someone please clarify
this?
A. That site is just using a old technique of placing a large amount of
space between the first link and the start of the HTML and JavaScript code. Not
sure why they are doing it because their code is nothing special. All you have
to do is scroll down and you will see the code.
News Goodies
Microsoft Buys Into SCO Group’s Unix
[May 19, 2003] The software giant licenses SCO Group’s Unix intellectual
property, as SCO presses its claim that Linux has
misappropriated key Unix code.
Click
here to read the article
Sun, Oracle Offer ‘Unbreakable’ Relationship
[May 19, 2003] UPDATE: The longtime partners become a ‘virtually linked
company’ with consolidated support and development using Sun Fire systems
and Red Hat Linux.
Click
here to read the article
Amazon.com Updates SDK with Web Services
[May 19, 2003] Go ahead – steal this cart. Amazon hopes Web services
will encourage developers to use its shopping cart.
Click here to read the article
Gateway Joins Recycling/Trade-in Trend
[May 19, 2003] As the computer maker continues to evolve, it looks to cash
in on the growing number of companies that allow trade-ins of old for new
models..
Click here to read the article
Pressplay To Become Napster
[May 19, 2003] Universal and Sony throw in the towel on their online
music subscription venture, in an ironic twist of ownership for the New
York-based Pressplay.
Click here to read the article
The Threat of Eternal Spamnation
[May 19, 2003] Interactive marketers must overcome customer wariness in the
wake of the spam deluge, says e-mail expert Hans Peter Brxndmo.
Click here to read the article
Microsoft Joins Security Firms in Virus-Warning Pact
[May 19, 2003] The company partners with Network Associates and Trend Micro
on the same day a new e-mail virus was detected masquerading as a missive
from Microsoft’s tech support.
Click here to read the article
Opera Debuts Latest Version for Linux
[May 19, 2003] The company updates its browser for Linux with a host of new
capabilities, including a built-in email client.
Click here to read the article
Yahoo! Kicks Off Wide-Ranging Search Campaign
[May 19, 2003] UPDATE: Following disclosures that reveal
just how critical search is to Yahoo!’s revenues, the portal
launches a campaign promoting the key feature.
Click here to read the article
Online Sales Soared 48% Last Year
[May 15, 2003] UPDATE: Did you leave your shopping cart at
the checkout? A new study predicts on-line merchants will
spend more technology dollars this year to keep you online.
Click here to read the article
Every week a site selected each week 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/
Sometimes you can’t win for trying!! Last week I wanted to
explain why we use "<." (see Q&A Goodies, above) in this
newsletter instead of the HTML code for a less than symbol.
To do so, I referenced the code itself — & L T –. I have
spaced it out here because…., yep, you guessed it! —
somebody couldn’t understand the difference between the
symbol and the code I referenced because their email program
interpreted the code and displayed the symbol!! As a
reminder, I use a period after the symbol because it show up
that way in every email program, and because using the
codes, & L T and & G T, would create the need for you to
perform two global edits before using the example, as
opposed to the one required by "<." This scheme works well,
but boy, it can be hard to explain it in an email
newsletter!
Top
And Remember This . . .
On this day in…
1897 Oscar Wilde released from Jail
Wilde, who was born and grew up in Ireland, graduated from
Oxford with honors and was famous for his wit at parties,
was jailed in 1895 after being sentenced to two years of
hard labor after being convicted of being a homosexual.
Married and father to two children, Wilde was "accused" by
the Marquess of Queensbury of being involved with the
Marquess’ son. Homosexuality was still considered a crime in
England at the time. His first trial resulted in a hung
jury, but a second jury believed the evidence presented.
Wilde was known for his flamboyant style and lavish
wardrobe. Many of us are still very familiar with his
accomplishments which include "The Picture of Dorian Gray",
"The Duchess of Padua", "The Importance of Being Ernest" and
"Lady Windermere’s Fan".
Born today were: in 1890, North Vietnam’s Ho Chi Mihn;
1925, black nationalist and civil rights activist
Malcolm X (Malcolm Little); 1945, Musician Pete
Townshend (you know Who!); 1952, singer Grace Jones;
1956, actor Steve Ford (son of former U.S. President
Gerald R. and Betty Ford)
Thanks for reading Goodies to Go!
