Meager Explanation of the Offset Pull-down Menus.

I’ve gotten enough questions about the html on my DD – specifically the pulldown bars on the left side – that I figured it was time to dedicate an entry towards explaining said html. Basically, this saves me the trouble of having to actually explain it twice. I like having entries that I can point people to. I sat in the dining hall thinking how I should go about this, as I’ve never done an entry explaining html before. I decided the best way would be to explain how I figured it out.

First off, I’d like to say that some of you people really need to learn how to check source code. I don’t believe in copying and pasting code without having SOME clue as to how it works. See something on somebody’s DD that you want to use for your own? Check the source code. Don’t feel bad – source code is pretty much public domain. I doubt anybody will go after you saying, “Hey, DON’T STEAL MY BOLD TAG.” Also, all webpages are stored in your temporary internet files on your hard drive (or, at the very least, your RAM), so the code IS already on your computer.

I know I’ve gone over some of your heads already. Pressing on.

The obvious question for the html n00b is “How do I check source code?” You can do this in one of numerous way.

1. If you have IE, GOTO the file menu. Click “View”. Click “source”. The source code of the page will show up in notepad. (I’ll just say that I have IE v6, your experience may vary.
2. I was talking to Poptart, and she said she can’t view source like that. So I told her the following other way to do it. GOTO the file menu. Click “file”. Click “save as”. Select a folder to save the file in that you’ll actually remember. Hit save. Using Windows Explorer, find the folder where you saved it. (If you need instruction on this, I pity you.) Right-click the html file you just saved and click “Open With…”. If the option for notepad is already there, click it. If not, click “choose program”. Under the “other programs” area, scroll down and look for notepad. Click it. Click Okay. You’ve just openned the source code using a nice round-about method.
3. Right-click anywhere on the page and click “View Source”. Amusingly, I never seem to use this method, even though it’s technically the fastest.

Odds are, the first time you see the source code to a typical page, you’ll go, “What the fuck is all that shit?!!” I’ll try to make this slightly less intimidating for you. You’re reading this, right? Open another window to your DD. (Or hell, my DD, if you want. The “diary contents” link is right there.) Choose your favorite method and look at the source code. I’m going to show you where that text that you type in for your DD shows up. In notepad, hit ctrl-F (or “Edit” – > “Find”). Type in something that you’ve typed into your DD. In my case, I might type “TimmyFromOD”, as I know that shows up on my DD. Hit enter (Or click “find next”) and you should see some of the shit you typed into that DD box. If you find yourself in a jumble of unfamiliar text, hit enter again until you see something familiar. Or, hell, just SCROLL DOWN until you see something familiar.

Okay, enough of this trivial shit. I did not, in fact, see pull-down menus offset like they are on my DD. I knew two things: the style portion of a img or table tag can offset them. That probably means nothing to you, so I’ll paste the code for the “Anyone But Bush” gif.

The important part of that tag is the “position: absolute” part. What does this mean? Instead of the position being relative to where the tag is placed, the position is now relative to the upper-lefthand corner of the window. The “left: 420” part means that it’s 420 pixels to the right of the upper-lefthand corner of the window. The “top: 26” means it’s 26 pixels down from the upper-lefthand corner of the window. I shall point out that I said “pixels”. By default, those numbers are pixels. How did I figure out what numbers to use? Extreme trial and error. After a while, you learn how much ten pixels is, or a hundred, or 1024 (the width of my resolution).

I don’t really remember where I got the tag for doing pull-down menus. So everybody can see what’s going on, I’ll crop some code and paste it.

onchange=”location.href=this.options[this.selectedIndex].value;”>Witty Title!Witty Description!

A menu would be displayed here, but apparently, Bruce has declared menus be outlawed in entries.

That’s your basic functional menu. I won’t even explain the code after the “onchange”. I believe that was something I copied and pasted. I could explain, but it would totally go over everybody’s head. (Well, most.) Hmm. Pull-down menus. What the hell else is there to explain? The select tag initializes the menu. And option tags are the options that are displayed. Smack a tag at the end to signify the end of the menu.

Now, let’s combine the two concepts.

*thunder and lightning strike down*

onchange=”location.href=this.options[this.selectedIndex].value;” style=”left: -4; ;top:400;width=139;font-size:9″>PoetryIf Only I Could CryMr. HappyNot My Sonoption value=”/entryview.asp?authorcode=C104458&entry=10205″>Bomb IraqI Believe in Bang Bang

That would be the entire code for the first pull-down menu I have. Yes, those menus eat a good portion of the chars on my DD. It’s as simple as this: The style portion of the initial select tag tells IE that the menu will be positioned relative to the window, not to where the tag appears in the code. You’ll notice that all the links are missing the “http://www.opendiary.com”. This was done purposely to save code. All the links are local links, so to speak.

Also, you’ll notice that all the code was displayed with the greater-than and less-than signs right next to the code. Normally, this causes your browser to read the code instead of just displaying it. However, I used the ascii (or is it unicode?) code for these characters. Specifically, &lt; for < and &gt; for >. It took me a while to memorize it, but it’s second-nature now.

Not enough chars to explain the sound that plays on my DD. Put those View Source skills to use and look for “wav” on my DD sou