Goodies To Go! Newsletter #340
http://www.htmlgoodies.com/introduction/newsletter_archive/goodiestogo/article.php/3511051/Goodies-To-Go-Newsletter-340.htm (Back to article)
************************************************************
Goodies to Go (tm)
June 6, 2005 -- Newsletter # 340
Goodies to Go (tm)
June 6, 2005 -- Newsletter # 340
This newsletter is part of the internet.com
network.
http://www.internet.com
http://www.internet.com
************************************************************
Featured this week:
* Goodies Thoughts - Back to Basics
* Q & A Goodies
* News Goodies
* Feedback Goodies
* Windows Tech Goodie of the Week
* And Remember This...
* Q & A Goodies
* News Goodies
* Feedback Goodies
* Windows Tech Goodie of the Week
* And Remember This...
************************************************************
Back to Basics
Most of you reading this newsletter have a pretty
good idea how to create web pages. There are some, however, who are apparently
just starting out. If this group includes you, please allow me to welcome you to
the web developer community. We're all very glad you're here! The Goodies
Thoughts in this edition of our newsletter are dedicated to you.
First, let me list a few statements of fact that are so important and
fundamental that they are often assumed to be known and are therefore
overlooked.
A web page is a document. The web page document is held in a file. The root
language for web pages is HTML. Files containing HTML documents almost always
have either .htm or .html as a suffix in their filename. When viewed in a
browser, such as the Internet Explorer, a web page can include a picture. The
picture does not become part of the HTML document (it is not part of the
document file) but is held in its own file, and is referenced by the HTML code
in the HTML document.
Pictures are usually in either JPEG of GIF formats, held in files with .jpg or
.gif suffixes, respectively. Pictures are referenced in web page documents by
their file name, including the suffix. The picture file must either be in the
same folder (directory) as the web page document, or the reference in the HTML
code must include the necessary path information to correctly reference the file
-- it's easiest for now to keep the picture files along side the HTML document
files that reference them.
As I mentioned, these two paragraphs contain some very basic information, but it
is surprising how many questions we receive that are answered by these simple
facts. Armed with this information, you should now be ready to proceed. The best
place to go from here are the Non-Technical Introduction (for some good
background information --
http://www.htmlgoodies.com/introduction/intro) and the HTML primers to learn
the code (http://www.htmlgoodies.com/tutorials/getting_started)
Happy (and sucessful) coding!
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
http://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>
<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. 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.
<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 question about backgrounds and style sheets. Is there
any way (such as using the "repeat-y" function) to get the background to
border down the right as opposed to the left side? Also, is there a way to
get it to tile down both sides? I am essentially interested in getting the
look of a border on both the left and right side of the page, but i want it
to appear correctly on all screen resolutions, so of course, making a very
long image with the desired left and right backgrounds simply on opposite
sides or the image would be impractical.
A. I have one way for this to work; however, it doesn't work in IE
5.5 (I don't currently have access to IE 6 at the moment, but can check
later). It does work in NN 6 and above, Mozilla, and Opera.
Add two divs to the bottom of your HTML file:
<div id="left"></div>
<div id="right"></div>
Then add the following CSS:
#left {
position: fixed;
top: 0;
left: 0;
width: 100px;
height: 100%;
border: 1px solid red;
margin: 0;
padding: 0;
background: url(ava.gif) repeat-y top left fixed; }
#right {
position: fixed;
top: 0;
right: 0;
width: 100px;
height: 100%;
border: 1px solid red;
margin: 0;
padding: 0;
background: url(ava.gif) repeat-y top right fixed; }
This will set backgrounds for the two extra divs in your HTML, and should tile the length of the page. IE 5.5 doesn't recognize the "fixed" property for anything other than background images for the BODY tag, so the extra divs scroll with the page.
Add two divs to the bottom of your HTML file:
<div id="left"></div>
<div id="right"></div>
Then add the following CSS:
#left {
position: fixed;
top: 0;
left: 0;
width: 100px;
height: 100%;
border: 1px solid red;
margin: 0;
padding: 0;
background: url(ava.gif) repeat-y top left fixed; }
#right {
position: fixed;
top: 0;
right: 0;
width: 100px;
height: 100%;
border: 1px solid red;
margin: 0;
padding: 0;
background: url(ava.gif) repeat-y top right fixed; }
This will set backgrounds for the two extra divs in your HTML, and should tile the length of the page. IE 5.5 doesn't recognize the "fixed" property for anything other than background images for the BODY tag, so the extra divs scroll with the page.
Q. I am constantly creating files (pdf or word) files that I need to
show to many co-workers. Instead of having to email everyone everytime I
finish a file, I would like to upload the file to my server and have them
view the list of files online and download the ones they want. These files
need to be password protected as different people in different departments
should only see files pertaining to them. Here was my idea, create a bunch
of password protected folders on a server - one for each department, and I
will upload the file to any folder that should be allowed to view these
files. Two questions: 1) I put the files in a folder, but when I try to
view the folder in a browser it tells me I don't have permission to access
this folder (I assume because I never created an index file). How can I set
it up that I should be able to view a list of files that are in the folder?
2) how can I create a page that will allow me to upload files to folders
using a browser?
A. I believe you are correct in that you do not have an INDEX file
for the server to show when you try to access the folder. You could create
an INDEX file with the links to the documents for downloading. I am assuming
that you have already password protected the folder? An even easier way
would be to use a password log in feature for your pages. The application
would allow users to sign up themselves and you would control which group
the user should be in and only the documents or files you allow each group
or person to view. There is a nice web application called ASPLogin. It has
to run on a server that supports ASP. For example, to make a document
available to all users in a group called 'management', members of a group
called 'administrators' and a user called 'fred' (who may or may not be in
either of the groups), you would add the following code to the top of the
document:
<%@ LANGUAGE=VBScript %>
<%
Set asplObj=Server.CreateObject("ASPL.Login")
asplObj.Group("management")
asplObj.Group("administrators")
asplObj.User("Fred")
asplObj.Protect
Set asplObj=Nothing
%>
Any other group or person trying to see that document will not be allowed to see it. It is a pretty slick application You can take a look here: http://www.asplogin.com
To create a page to allow you to upload documents would call for some scripting. This all depends on what type of server you site is hosted on. If it is a Windows server then it will support Active Server Pages (ASP).
<%@ LANGUAGE=VBScript %>
<%
Set asplObj=Server.CreateObject("ASPL.Login")
asplObj.Group("management")
asplObj.Group("administrators")
asplObj.User("Fred")
asplObj.Protect
Set asplObj=Nothing
%>
Any other group or person trying to see that document will not be allowed to see it. It is a pretty slick application You can take a look here: http://www.asplogin.com
To create a page to allow you to upload documents would call for some scripting. This all depends on what type of server you site is hosted on. If it is a Windows server then it will support Active Server Pages (ASP).
Q. Is there was a way to position a background image in the center of
a page regardless of screen resolution?
A. This code will position the image in the center:
body {
background-image : url(image.jpg);
background-position : center center;
background-repeat : no-repeat;
}
body {
background-image : url(image.jpg);
background-position : center center;
background-repeat : no-repeat;
}
To position in the center of a table, try using this (be sure to replace __
with the height and width of the image):
<body>
<table height="100%" width="100%">
<tr><td valign="center" align="center">
<table height="__" width="__" background="image.jpg">
Any text on the background
</table>
</td></tr>
</table>
</body>
<body>
<table height="100%" width="100%">
<tr><td valign="center" align="center">
<table height="__" width="__" background="image.jpg">
Any text on the background
</table>
</td></tr>
</table>
</body>
News Goodies
***********************************
***********************************
Intel Said To Win Apple's Eye
[June 6, 2005] CEO Steve Jobs will reportedly announce that Apple will switch from the PowerPC to the Intel x86-based chip.
Read the article:
http://www.internetnews.com/ent-news/article.php/3510341
[June 6, 2005] CEO Steve Jobs will reportedly announce that Apple will switch from the PowerPC to the Intel x86-based chip.
Read the article:
http://www.internetnews.com/ent-news/article.php/3510341
Flash For The Next Generation
[June 6, 2005] Macromedia's animation software is blanketing the software ecosystem.
Read the article:
http://www.internetnews.com/dev-news/article.php/3510226
Microsoft Communicates Convergence
[June 6, 2005] Redmond's communications sector strategy includes new partnerships with an eye toward converged voice, media and applications.
Read the article:
http://www.internetnews.com/infra/article.php/3510346
HP Trots Out New Compliance, SOA Software
[June 6, 2005] Think compliance and distributed computing isn't top of mind for corporations? HP says think again.
Read the article:
http://www.internetnews.com/dev-news/article.php/3510216
Is Tape Winding Down as a Backup Option?
[June 6, 2005] Recent well-publicized backup tape losses appear to be pushing some storage users to consider disk-based alternatives.
Read the article:
http://www.internetnews.com/storage/article.php/3510201
Red Hat Frees Fedora, Calls For Commons
[June 3, 2005] Community Linux project to be run by Fedora Foundation under new plan. Skeptics abound.
Read the article:
http://www.internetnews.com/dev-news/article.php/3510141
Legislation Aims to Stop Muni Wi-Fi
[June 3, 2005] A new bill would prohibit state and local governments from competing with private-sector providers.
Read the article:
http://www.internetnews.com/wireless/article.php/3509961
Will Webmasters Move to .xxx?
[June 3, 2005] UPDATED: ICANN's given its initial approval for an Internet red-light district, but will anyone show up?
Read the article:
http://www.internetnews.com/xSP/article.php/3510056
Deep Tax Breaks Offered For Broadband Access
[June 3, 2005] Legislation offers tax incentives for rural broadband providers.
Read the article:
http://www.internetnews.com/xSP/article.php/3509906
Ever-Morphing Bagle Virus Going Strong
[June 3, 2005] Trojan makes rounds again, searching for PCs to turn into zombies.
Read the article:
http://www.internetnews.com/security/article.php/3509901
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:
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 helps 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 for all your feedback!
Windows Tech Goodie of the Week
***********************************
Implementing AJAX Using ASP.NET 1.1
AJAX is an acronym that stands for Asynchronous JavaScript and XML. AJAX's
strong point is that it allows data on a page to be dynamically updated
without the browser having to reload the page. This article offers a brief
introduction and description of AJAX and then provides some sample code
illustrating its usage.
*** AND ***
Little Known, Invaluable Methods and Properties in the .NET Framework Base Class Library: Working with Colors
In a previous 4Guys' article I introduced a number of little known, but
highly useful methods for working with file paths. Today's installment will
look at methods and properties useful for programmatically working with
colors.
*** AND ***
Don't Use Select * in Database Queries
While there's technically nothing wrong with using "Select *" within a
query, using that syntax could be stealing away precious performance from
your application, and even it it's not now, it might someday soon.
And Remember This ...
***********************************
***********************************
On this day in...
1844 Thee Young Men's Christian Association (YMCA) was founded in
London; 1889 25 downtown blocks were destroyed in the Great Fire in
Seattle; 1925 Walter Percy Chrysler founded Chrysler Corp.; 1933
the first drive-in theater opened (in Camden NJ); 1934 the US
Securities and Exchange Commission was established; 1944 D-Day, the
150,000 strong Allied Expeditionary Force landed at Normandy, France;
1955 Bill Haley & the Comets hit #1 with "Rock Around the Clock";
1960 Roy Orsbison recorded "Only The Lonely"; 1962 The Beatles
recorded "Besame Mucho" with Pete Best on drums; 1966 activist James
Meredith was shot in Mississipi; 1975 British voters decided to
remain in the Common Market; 1975 the Provisional Revolutionary
Government of South Vietnam was established; 2012 the next Transit of
Venus will occur (see
http://www.transitofvenus.org);
Born today were: in 1755 patriot Nathan Hale; 1868 explorer
Robert Falcon Scott; 1875 auto manufacturer founder Walter Percy
Chrysler; 1918 actor Richard Crane; 1932 English actress
Billie Whitelaw; 1935 Tibetan spiritual leader, the Dalai Lama;
1949 actor Richjard Lewis; 1949 actor Robert Englund; 1955
comedian/actor Dana Carvey; 1955 comedienne/actress Sandra Bernhard;
1956 acrtess Marilyn Jones; 1959 actress Amanda Pays; 1960
actor Gary Graham; 1961 actress Sydney Walsh 1967 actor
Max Casella;
