 |
Ami's Cheat Sheet!
Easy cut-and-paste codes for your page |
Usagi-star: As Ami is the most technically-minded of us, I asked her to write out some handy HTML codes that can be copied and pasted to make your page better. Yes, I know this is like cheating, but it's also a time-saver. For those who want to argue about the moral implications of taking these little bits of code, talk to someone else. I personally don't think this is a moral issue; it's not like we're stealing ideas or content. So flame all you want, I don't care. Thanks.
Ami: Ok, well, first of all, even though I'm not the HTML expert that Usagi-star says I am, I do have a few things I've collected on my travels through the web ... umm...
Minako: Hey Ami! Usagi and I took a spontaneous shopping trip today and bought THE CUTEST outfits for everyone! You wanna see yours?
Ami: Minako, I'm kind of in the middle of something ...
Minako: It can wait, Ami-chan! Look at this sweater! Doesn't it just bring out the blue in your eyes? And hair, for that matter?
Ami: That's very nice, Minako, but -
Minako: And just look at Usagi's! This is the latest style- everyone's wearing them!
{Makoto and Rei come in and drag Minako away}
Minako: Hey! Where are you taking me?! My opinions deserve being listened to! I'm a person with feelings too!
Ami: Ehhehehe... gomennasai, minna! {Sorry, everyone!} Minako has been drinking a lot of Jolt lately... ^^;;
As I was saying, here are a few things I've collected that might be of use. This page sort of assumes that you know HTML, the hyper-text markup langauge. If you don't, I would suggest going to some place like HTMLGoodies.com to learn. Or you can look at the Helpful Links page by Minako and find a good HTML tutorial. Arigatou.
Ever been to a page where every time you drag your mouse over a link, text appears in the bar on the bottom? Isn't that the coolest effect? It can be done very easily, just insert the link like normal, and then make sure you put the link text in:
<A HREF="your-link.html" onMouseOver="window.status='Introduction'; return true;" onMouseOut="window.status=defaultStatus">That's all there is to it! Just insert the link name, of course.
And then there's the awesome effect of making non-underlined links. Many people have complained about people copying and pasting this into their heading without knowing what it really means, but it's fast and easy for those who don't want to spend the time learning. I could take a few minutes to explain it, actually ...
Usagi-star: Er, I don't think that will be necessary, Ami-chan. Continue with the lesson ^_^
Right! So what you do is paste this little code somewhere inside the <HEAD> and </HEAD> tags:
<STYLE TYPE="TEXT/CSS">
<!--
A { TEXT-DECORATION: NONE }
//-->
</STYLE>
There you go!
You can also make one of those drop-down menus with the "Go!" buttons on the side using this code:
<FORM name="MainMenu">
<SELECT NAME="Golink">
<OPTION VALUE="http://put your
link here.htm">Put your page name here</OPTION>
<OPTION VALUE="http://put your
link here.htm">Put your page name here</OPTION>
<OPTION VALUE="http://put your
link here.htm">Put your page name here</OPTION>
<OPTION VALUE="http://put your
link here.htm">Put your page name here</OPTION>
</SELECT>
<INPUT TYPE="button" VALUE="Go!"
OnClick="location= (MainMenu.Golink.options [MainMenu.Golink.options.selectedIndex].value)">
</FORM>
You will also need to take out the spaces in the <INPUT> tag, which were put in there for aesthetic purposes.
Unfortunately, you need a Javascript-enabled browser to use this. If you want one that doesn't use Javasciprt, you can go to BeSeen.com, where they have a bunch of good stuff.
Ok, and then there's the OnMouseover images that change when your mouse is dragged over the image. This is a very basic version of that javascript code:
<a href="http://your-link-here.html"
onMouseOver = "document.one.src='http://Put your picture name that is shown
when the mouse is over the image here.gif'; return true;" onMouseOut
= "document.one.src='http://put your image name that is shown when the
mouse isn't on the image.gif'; return true;">
<IMG SRC="http://put your image
name that is shown when the mouse isn't on the image here.gif" border="0"
name="one"></a>
If you want to use that effect on more than one image, you would re-paste the code each time and change the document.one.src part into document.two.src or insert whatever number or word you'd like, just so each picture has a different name and the computer doesn't get confused.
That's all I have for now! Have fun!
