FAQ on JAVASCRIPT
Table Of Contents
1. Keywords. 2
2. Introduction. 2
3. Target Readers. 2
4. Tips and Tricks. 2
4.1. How do I use a JavaScript link to return to the previous page?. 2
4.2. How do I get the page background image to stay fixed when the page is scrolled? 2
4.3. How can I set a window’s size when it is opened?. 2
4.4. How can I set a window’s position when it is opened?. 3
4.5. How do I use JavaScript to scroll to the top of the page?. 3
4.6. How do I stop the scrollbar from showing in a regular window?. 3
4.7. How do I attach more than one style to an element?. 3
4.8. How do I close a regular window with a JavaScript link, and how would I do it if I am using frames?. 4
HTML, JavaScript, Style, Blur, History, Self, Document
JavaScript includes what is called a history object. It tracks the URLs visited by the browser. You can use this browser history as a means to return to the previous page (or, for that matter, to go back and forward through the history). This is especially useful when a hard-coded, specific link is not possible; for instance, in cases where you do not necessarily know the address of the previously visited page. This is how a “previous page” or “go-back” link would appear in your HTML code:
<a href=”javascript:history.go(-1)”>
Go Back
</a>
Alternatively, if you wanted to go forward instead of backward in the history, you would write the code thus:
<a href=”javascript:history.go(1)”>
Go Forward
</a>
The numbers in the parentheses are the number of pages to move (forward or back, respectively, in the above examples). You can also move more than one page; for instance javascript.history.go(-3) would navigate three pages back in the history. Note that if there is no page in the history to go to, the JavaScript does not error out; it simply does nothing.
One simple way is to add bgproperties=”fixed” to the body tag, like this:
<body bgproperties=”fixed”>
Put this as early in the <head> of the page as possible:
<script>
self.resizeTo(100,200);
</script>
Set the dimensions in the parentheses. The first number is the width; the second is the height
Put this as early in the <head> of the page as possible:
<script>
self.moveTo(100,200);
</script>
Set the position in the parentheses. The first number is the x (that is, left) position; the second number is the y (that is, top) position
The following JavaScript link in your page will cause the page to scroll to the top:
<a href=”javascript:scroll(0,0)”>
Top
</a>
The first number is the x position, the second is the y position. (Positions are in pixels.) So, you can also change these numbers to scroll to a specific point on a page, too.
In windows where you have a minimum of content, or for design reasons do not want the browser scrollbar to show, you can remove the scrollbar by adding scroll=”no” to the page body tag, like this:
<body scroll=”no”>
A perhaps more sensible approach in most cases, however, is to use scroll=”auto” instead. This removes the scrollbar from the page when there is no need for it; but shows the scrollbar when content exceeds the length of the window. Thus:
Basically, you just put them all in a row with a space between them when you attach the class, as in this <div> example, where three different styles are used:
<div class=”styleOne styleTwo styleThree”>
For instance, let’s say we have this style script in the head of the page:
<style>
.bigText {
font-family: sans-serif;
font-size: 20px;
}
.redItalic {
color : red;
font-style: italic;
}
.lineThrough {
text-decoration: line-through;
}
</style>
To attach that to a <div> with some text, it would look like this:
<div class=”bigText redItalic lineThrough”>
Hello
</div>
with the result showing, thus…
For a regular window, use this:
<a href=”javascript:window.close()”>Close</a>
If you are using a frameset, then use this in any page in any frame in the frameset:
<a href=”javascript:top.window.close()”>Close</a>