|
|
March 03, 2006--HTML 6
Before I start coding this morning, I would like to tell you about something totally unrelated. I receive the magazine "Guideposts"; there was an article this month about "Knit for Kids".
If you are a knitter, you might be interested in this; On their website, they have the patterns they use and the story, of course. I am going to start doing this; I am from Canada, so I will not be sending my sweaters to them; I will simply drop them in boxes for the needy.
This is the link, if you're interested:
I've never said this before and I guess I should have.
If you are not using HTML-kit that I mentioned before, you can use notepad to write your code.
It is not versatile but it'll do the trick in a pinch.
Simply write and save with an HTML extension, like this:
My Stationery.html; then when you want to make changes to the code, open your html file, go view, source and change.
When you are done, hit "save as"; it will ask you if you want to save the changes and you will say yes.
A word in passing: If you look at source on webpages, you might have come across "nbsp" and wondered what it was. It simply indicates a space in the line.
If you have a graphics program why don't you try this:
make a graphic 1200X24 and make sure it has a seamless edge and use it as a background.
We can go one step further here and make it scroll.
This is the code; Copy and paste:
<SCRIPT language=VBscript>
x=0
y=0
Sub Window_onload()
window.status=" --- stationery by me--2006---"
SetInterval"scrollback",64
End Sub
Sub scrollback()
y=y-1
document.body.style.backgroundPosition=x&" "&y
End Sub
</SCRIPT>
and it goes in the body of your email.
This is another little code that you can copy and re-use.
Now, let me explain this code:
y stand for vertical; x stand for horizontal.
under Sub scrollback(), you have y=y-1; that will make it move up;
if it was y=y+1, it would move down.
Now if below that you add x=x-1, it will move up and left, and of course,
if you changed the minus (-) to plus (+) on the x, it would move in the opposite direction.
So you can use any combination of x and y values to make it move in the direction that you want.
You can change the speed also by changing the 1 to something else;
don't get carried away; you don't want it to go too fast....
Well I hope this is clear as day for you.
There is another element in this script that you may not have noticed.
It is right under Sub_window onload()
and it says: window.status=" --- stationery by me--2006---";
Now, you can take that out if you want to, but try it and you will see "stationery by me---2006" at the bottom of your stationery window.
Change the wording and you can have your name in lights, so to speak.
Is it fun, or what?
OK, we are on a scroll roll, so I thought you might like some more movement before we finish for today. This next element is called "marquee" it will make your text (and/or picture) move...Try this:
Open a new message. Write Happy Birthday; now, go to source; after <div>before Font, place this tag: <marquee> then go to just before </div> and place the closing </marquee>
Now, hit edit at the bottom of your screen; is Happy Birthday moving left? Hurray!!!!
It could move differently and at different speeds and do much more too. Want to see?
so, to change direction, add direction=right, or up, or down, or left, of course.
to make it scroll differently, add behavior=alternate, or scroll, or slide.
To add a background color, add bgcolor=#......;
To position it exactly, add style="LEFT: 100px; POSITION: absolute; TOP: 100px", as I have it below;
change the numbers for left and top to place it where you want.
If you want it to be a specific size, add width=300 height=50; change the numbers;
and did you notice there is an image in there? it can be placed before or after the words, or you can have just a picture,or just words; it's up to you;
scrolldelay is how quickly it is moving; scrollamount is how many pixels are moving;
These 2 give you speed control; adjust them to your liking;
so you now have all the elements for the control of your marquee.You will not use all of them, all the time; you will choose what you need, to make it look the way you want.
Finally, you'll ask:"What is position absolute?" It is to keep the marquee in the same position for all your viewers; get used to using that expression.
Below is an example of a marquee with all the attributes in it:
<MARQUEE style="LEFT: 100px; POSITION: absolute; TOP: 100px" direction=right behavior=slide
width=300 bgColor=#000000 height=50 scrollamount=1 scrolldelay=40><b>
<FONT face=Diner color=#ffffff size=5>Happy Birthday</FONT></b><IMG
src="C:\exact path">
Have fun!!!
Ciao for now.
| | | |
