A TO Z HTML CODE

HTML - Scripts

There are two very popular scripting languages that are commonly used in HTML to make web pages come alive. JavaScript and VBScript are very useful scripting languages to know, if you have the time.

With HTML scripts, you can create dynamic web pages, make image rollovers for really cool menu effects, or even validate the data on your HTML forms before users submit their information. However, JavaScript and VBScript are very complicated compared to HTML. It may be simpler just to download someone else's scripting code and modify it for use on your web page (if they have given you permission to do so, of course!).

HTML Javascript Code

If you want to insert JavaScript code into your HTML, you are going to use the <script> tag. If you would like to know more about JavaScript, check out our JavaScript Tutorial. Below is the correct code to insert embedded JavaScript code onto your site.

HTML Code:

<!--script

***Some JavaScript code should go here***

-->

</script>

For JavaScript, you set the type attribute equal to "text/javascript", which is similar to the process of specifying CSS. We can also include a comment around the JavaScript code. This will prevent browsers that do not support JavaScript or have had JavaScript disabled from displaying the JavaScript code in the web browser.

HTML VBScript How To

To insert VBScript code onto your website, you must once again make use of the <script> tag. Below is the correct code to insert VBScript code onto your site.

HTML Code:

<!--script

***The VBScript code should go in this spot***

-->

</script>

For VBScript, you set the type attribute equal to "text/vbscript", which is similar to specifying CSS. We also include a comment around the VBScript code. This will prevent browsers that do not support VBScript or have had VBScript disabled from displaying the VBScript code in the web browser.

HTML -

Scripting languages such as JavaScript and VBScript must be commented out as well. You will learn that it is only once they are placed within the <script> tags that the browser executes the scripts without causing errors.

HTML Code:

<!--

document.write("Hello World!")

//-->

</script>

With this example, we are jumping far ahead. Just be sure you understand when to use comments and where to look for them. They are a very useful tool for any large HTML project.

Additional Spaces and <>.

Regardless of how many spaces you place between words, your web browser will only render a single space. To get around this, use the non-breaking space character entity.

HTML Code:

<p>Everything that goes up, must come &nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp; down!</p>

Spaces:

Everything that goes up, must come down!

In HTML, we use less than and greater than characters to create tags, so to use them on your website you will need entities.

HTML Code:

<p>
Less than - &lt; <br />
Greater than - &gt; <br />
Body tag - &lt;body&gt;
</p>

Less than Greater than:

Less than - <
Greater than - >
Body tag - <body>

Take a few minutes to view and play with the symbols listed in the Entities Table.

HTML Character Entities

An "entity" is a fancy term for a symbol. Several symbols, such as copyright, trademark, or foreign cash symbols, exist on your standard keyboard, so you need to display these characters using a different method.

There are three parts to every entity.

Each begins with a ampersand - &
Then the entities name - copy
And finally a semicolon - ;

Copyright:

Combine © to make - © - Copyright symbol.

Expect complications if you forget to include all three parts of an entity.

More Entities:

¢	Cent	¢	¢
£	English Pound	£	£
¤	Currency	¤	¤
¥	Yen	¥	¥
®	Registered Trademark	®	®
°	Degree(s)	°	°
±	Plus or Minus	±	±
¼	¼ Fraction	¼	¼
½	½ Fraction	½	½
¾	¾ Fraction	¾	¾

View a more complete list at: Entities Table

Noresize and Scrolling

It's possible to further customize the <frame> tag using the noresize and scrolling attributes.

HTML Code:

<html>
  <body>
    <frameset border="2" frameborder="1" framespacing="2" rows="20%,*">
      <frame src="title.html" noresize scrolling="no">
      <frameset border="4" frameborder="1" framespacing="4" cols="30%,*">
        <frame src="menu.html" scrolling="auto" noresize>
        <frame src="content.html" scrolling="yes" noresize>
      </frameset>
    </frameset>
  </body>
</html>

Noresize and Scrolling:

Here's the Visual: Visual

noresize - Determines whether the frames can be resized by the visitor or not. (values "true" and "false")
scrolling - Determines whether scrolling is allowed in the frame or not (values "true" and "false")

We set the scrolling for our content frame to "yes" to ensure our visitors will be able to scroll if the content goes off the screen. We also set the scrolling for our title banner to no, because it does not make sense to have a scrollbar appear in the title frame.

Frame Name and Frame Target

How nice would it be to make each menu link load into the content page? We do this by naming each frame and setting the correct base target inside "menu.html".

HTML Code:

<html>
  <body>
    <frameset rows="20%,*">
      <frame name="title" src="title.html">
      <frameset cols="30%,*">
        <frame name="menu" src="menu.html">
        <name="content" src="content.html">
      </frameset>
    </frameset>
  </body>
</html>

HTML Code:

<html>
  <head>
    <base target="content">
  </head>
  <body>
    <!-- Content Goes Here -->
  </body>
</html>

Frame Target:

Here's the Visual: Visual

We first named the content frame "content" on our frame page, and then we set the base target inside "menu.html" to point to that frame. Our frame page is now a perfectly functional menu and content layout!

FrameBorder and FrameSpacing

You've probably noticed those ugly gray lines that appear between the frames. It is possible to remove these and manipulate the spacing between frames with frameborder and framespacing. These attributes appear within the frameset tag.

Note: Framespacing and border are the same attribute, but some browsers only recognize one or the other, so use both, with the same value, to be safe.

frameborder="#" - Determines whether there will be a border.
border="#"- Modifies the border width.
framespacing="#" -Modifies the border width, used by Internet Explorer.

Here's an example of the same frameset without the borders.

HTML Code:

<html>
  <body>
    <frameset border="0" frameborder="0" framespacing="0" rows="20%,*">
      <frame src="title.html">
      <frameset border="0" frameborder="0" framespacing="0" cols="30%,*">
        <frame src="menu.html">
        <frame src="content.html">
      </frameset>
    </frameset>
  </body>
</html>

Adding a Banner or Title Frame

Add a row to the top for a title and graphics with the code as follows:

HTML Code:

<html>
  <body>
    <frameset rows="20%,*">
      <frame src="title.html">
      <frameset cols="30%,*">
        <frame src="menu.html">
        <frame src="content.html">
      </frameset>
    </frameset>
  </body>
</html>

Pages

A TO Z HTML CODE

Labels

Free HTML Software

Popular Posts

Blogger news

About

Sunday 1 December 2013

HTML - Scripts

HTML - Scripts

Additional Spaces and <>.

Additional Spaces and <>.

HTML Code:

Spaces:

HTML Code:

Less than Greater than:

HTML Character Entities

HTML Character Entities

Copyright:

More Entities:

Noresize and Scrolling

Noresize and Scrolling

HTML Code:

Noresize and Scrolling:

Frame Name and Frame Target

Frame Name and Frame Target

HTML Code:

HTML Code:

Frame Target:

FrameBorder and FrameSpacing

FrameBorder and FrameSpacing

HTML Code:

Adding a Banner or Title Frame

Adding a Banner or Title Frame

HTML Code:

Blogger templates

Blog Archive