HOME       Family Pages     Computer Help     Story List     Making Pictures     All Pages  

Script for Image behind Text

Hints for editing the script and a picture of the finished stationery are shown here.  

Directions for making the tiles are here.  On this page, the actual script starts here.  

Using This Script

To use the script, copy it and paste it into Notepad or some other plain text editor. I use a program called NoteTab.

  1. Open a new file in your plain text editor program.
  2. Click Save and save the file as balloons.htm.
  3. Click back to this page.
  4. Click just before the beginning of the blue text. (Nothing appears to happen. Don’t worry.)
  5. Hold the shift key down and keep holding it while you scroll to the end of the blue text. (It’s a long way down.)
  6. Still holding the shift key, click. Everything you want to copy should now be highlighted.
  7. Let go of the shift key and press and hold the ctrl key. Tap c.
  8. Let go of ctrl.
  9. Bring balloons.htm to the front by clicking on it or by clicking its button on the taskbar.
  10. Click into balloons.htm.
  11. Press and hold the ctrl key and tap v. The copied text should appear.
  12. Save the document.

The Script

<html>

<head>

<style type="text/css">

body {margin-top: 1.5em;
margin-bottom: 0em;
margin-left: 5%;
margin-right: 5%;}

.tab1 {border-top-width:6;
border-right-width:6;
border-bottom-width:6;
border-left-width:6;

border-top-style:solid;
border-right-style:solid;
border-bottom-style:solid;
border-left-style:solid;

border-top-color:#00ff00;
border-right-color:#009900;
border-bottom-color:#009900;
border-left-color:#00ff00;

color:#009900;
background:#66ff66;}


.tab2 {border-top-width:6;
border-right-width:6;
border-bottom-width:6;
border-left-width:6;

border-top-style:solid;
border-right-style:solid;
border-bottom-style:solid;
border-left-style:solid;

border-top-color:#009900;
border-right-color:#00ff00;
border-bottom-color:#00ff00;
border-left-color:#009900;}

p {font-weight: bold;
font-size: small;
font-family: "verdana", "arial", sans-serif;}


</style>

</head>


<body bgColor="#66ff66" background="C:\Program Files\Common Files\Microsoft 
Shared\Stationery\birthday balloons\balloons02.gif">
<div align=center>
<center>

<table class="tab1" width="100%"

summary="This table is to create a border.">

<tr>

<td class="tab2">

<table id=tab2 width="100%"
summary="text area."><tr><td>

<p>

<img src="C:\Program Files\Common Files\Microsoft 
Shared\Stationery\birthday balloons\candlespark.gif" width="28"
height="39"  align="left" alt="candle">

TYPE YOUR GREETING HERE

</p>

</td></tr></table>

</td></tr></table>

</center></div>

<!--Embedded Table Background Image Here-->
<!--This part by Susan aka Night Owl web site
http://www.creativelydesigned.com/oe6tutorial.html-->

<IMG id=tab2bkg
style="DISPLAY: none; LEFT: -1800px; POSITION: absolute;
TOP: -1800px" src="C:\Program Files\Common Files\Microsoft 
Shared\Stationery\birthday balloons\balloons02m.jpg" alt="balloons">

<script language=vbscript type="text/vbscript">
tab2.background=tab2bkg.src
</script>

</body>
</html>

Return to top

Valid HTML 4.01!