Design By Renee
Lesson Nine Part Two The Script
Please Note***These pages will be
graphic intense, they will take a while to fully download. Use your refresh button to
reload the page to check for updates on this page. ...Renee
Lesson Nine is a Bounce Single Object Script. It is actually a very easy script to do. You need to keep your transparent image small enough that it "bounces" smoothly across the background. Too large of a transparent image creates a jerky distorted bounce, and you will notice pixel breaks, Myself, I would recommend under 75x75 for the .gif, that seems to be a good bouncing size. Well, if you have made it this far, I am very proud of you! Only one more lesson to go and you can go on into more advanced scripts!! So if your ready, let's get our images inserted into the script!
The Script
FirstStepper's Download
Script here
By now you should know how to save the script, so I won't be adding those screen captures. If you need help, please refer to a previous lesson.
<HTML><HEAD>
<STYLE TYPE="text/css">
<!--
body {
The font family describes the font you want to use and
see in your stationery. But know this, if the receiver does not have the same font in
their fonts folder, they will only see their "default" font on your stationery.
font-family: "Comic Sans MS";
Font size is determined by what font you choose, some
fonts at 14pt are really small, and some are a normal reading size. Determine this by the
font you are choosing. If you change the font size here, since 14pt is "normal"
there is sometimes a place down in the script you will need to change to match or it will
not change. It is in this script. If you change the font size here, scroll
down below and change it also.
font-size: 14pt;
Place the margin at the width of your graphic if you
use a graphic or image. If no image is used, and you use a full bkg make
it 10 to 20 px's.
margin-left: 10;
margin-right: 10;
This section tells you what color is the first loaded
into the computers viewer. It is actually the color behind your stationery. I put mine at
the main color I chose for my background. Most computers will show this color before the
actual stationery.
background-color: #000000;
This is the color you want your font to be seen on
your stationery.
color: #FFFFFF;}
-->
</STYLE>
</HEAD>
Your background image is what will cover the whole
background. The bgColor is
the same as you entered above. It's the color your viewer will put behind
your stationery.
<BODY background="c:\program files\common files\microsoft
shared\stationery\yourbkghere.jpg" bgColor=#000000>
<BODY>
Below is where your bouncing image or transparent
gif will go:
<IMG id=pic src="file://C:\Program Files\Common Files\Microsoft Shared\Stationery\yourbouncing.gif"
style="position:absolute;top:0;left:-1800">
Have your midi in your stationery folder and making
sure the titles are exact enter your midi here.
<BGSOUND id=music loop=99 src="file://C:\Program Files\Common Files\Microsoft Shared\Stationery\yourmidigoeshere.mid">
<SCRIPT language="VBSCRIPT">
REM Edgar V. Poirier
REM [email protected]
Dim w, wW, wH, x, y, ox, oy, sL, sT, myTimer
Set w=document.body
sub setUp()
on error resume next
REM Get window dimensions
wW=w.clientWidth
wH=w.clientHeight
REM Repeat to fix an OE bug
wW=w.clientWidth
wH=w.clientHeight
sL=w.scrollLeft
sT=w.scrollTop
REM Bounce increment
randomize
ox=3+INT(RND()*4)
oy=3+INT(RND()*4)
REM Initial coordinates
x=INT(rnd()*wW)
y=INT(rnd()*wH)
REM start bouncing
bnce
end sub
REM This is the VBScript version of the Bounce Routine
sub bnce()
ClearTimeOut(myTimer)
REM VBScript version of bounce routine
REM Point to the bouncing object
Set bal=document.all("pic")
REM Increment position
x=x+ox
y=y+oy
REM Check for walls
if (x + bal.offsetWidth > wW + sL) OR (x <= sL) then
ox=-ox
if (x < sL) then x = sL
if (x + bal.offsetwidth > wW + sL) then x = wW - bal.offsetWidth + sL
end if
if (y + bal.offsetHeight > wH + sT) OR (y <= sT) then
oy=-oy
if (y < sT) then y = sT
if (y + bal.offsetHeight > wH + sT) then y = wH - bal.offsetHeight + sT
end if
REM Position object
bal.style.posTop = y
bal.style.posLeft = x
REM Repeat. If bounce is too fast, increase the number
REM in the line below from the default value of 2.
Where the 2 is below this sentence you can change to
a higher number to slow down the bouncing image, such as 3, 4, 5 or 6.
myTimer=SetTimeOut("bnce",2)
end sub
REM This sub starts the action as soon as the message is received.
sub window_OnLoad()
REM Get users screen resolution
wx=window.screen.width
REM and adjust font size to match.
Res=INT(wx/128)
If you changed the font size above from 14, change
it here also.
w.style.fontSize = 14+Res
setUp
end sub
REM In case window is re-sized
sub window_OnResize()
setUp
end sub
REM In case text is scrolled this keeps the bouncing inside the window.
sub window_OnScroll()
sL=w.scrollLeft
sT=w.scrollTop
end sub
Enter your ticker script message here. Can be the name
of your stationery, have a nice day, your name, anything you would like others to see.
Keep your message in between the quotation marks, do not put any other quotation marks in
the ticker script. Leave some space between the first set of quotation marks and your
message so that it is not up against the wall of your computer.
</SCRIPT>
</BODY>
<script language="JavaScript">
<!--
ScrollSpeed = 275; // milliseconds between scrolls
ScrollChars = 4; // chars scrolled per time period
function SetupTicker() {
// add space to the left of the message
msg = " . . . .Your Message
Here. . . . ";
RunTicker();}
function RunTicker() {
window.setTimeout('RunTicker()',ScrollSpeed);
window.status = msg;
msg = msg.substring(ScrollChars) + msg.substring(0,ScrollChars);}
SetupTicker();
<!-- end -->
</script>
<!--VERMEER BOT=HTMLMarkup EndSpan -->
</HTML>
Are you getting a little more familiar with the steps?
OK... now open your Outlook Express, click Message/click New message using/click
select stationery.
In the stationery view window move the scroll bar till you see your stationery. You
will only see the html version. Click on it, and click ok.
Now your stationery should have opened up in the New Message Window.
**You will notice that your bouncing image is not in the edit window.
They will be normal in the preview mode.. Click on the preview tab to view the
bouncing gif or .jpg, your font size and colors. If you need to make any
changes, close the window, make your changes in your notepad, save, then open your
stationery again in your Outlook Express. Don't Forget to
save your changes in both the HTML and TXT versions.
Click on the preview tab to see the bouncing image and ticker and hear the music.
Is everything working? Do you see the bouncing image? Is your ticker displaying your message?
Do you hear your midi playing?
If you did NOT get an error window CONGRATULATIONS!!!! YOU DID
IT!!!
Now click back to the edit tab and test your font, is the color light enough? Is it
too close to the graphic or too far away? Is it large enough or too large? Do you want to
change anything? If you do, close the stationery, maximize the notepad html and make the
changes, click save (since it is still active and open you can make changes) and open your
stationery again to view the changes.
If you made changes you must save as both html and txt again
If you are quite happy with everything then send the stationery to yourself to verify its
working correctly. If it is, and you have saved both your html and txt, then close your
Notepad you are done with lesson nine!
If in the future you want to make changes in this stationery, open up the txt file, make your changes, save as both .txt and html again.
Please
Click Here To See The Finished Stationery
This will take a moment to load, as I have placed it as a txt version, This way you can
click on View/Source so that you can see the actual stationery changes that I made. You
can see the names and sizes and colors. Use your "back" button to return to this
page
Please Sign my Guest
Book!
I Would Love To Know You Were Here!
Proud Member Of
All Backgrounds And Images Created In
Site Designed And Maintained With
Backgrounds
and Site Design
Created By
Design By Renee
RD
Copyright 1999-2000-2001 Renee Davis
Welcome
Home Lesson
Index Lesson
One
Lesson One-Part Two Lesson Two
Lesson Two-Part Two Lesson
Three Lesson Three Part-Two
Lesson Four Lesson
Four Part-Two Lesson
Five Lesson
Five Part-Two Lesson Six
Lesson Six Part-Two
Lesson Seven Lesson
Seven Part-Two Lesson Eight Lesson
Eight Part-Two
Lesson
Nine Lesson Nine Part-Two
Lesson Ten Lesson
Ten Part-Two
PSP View
Links