Forward code
Making a web page with clear backgrounds
and scrollbars.
The first thing you need to do is open notepad.
You can open easy designer and do this too but you'll get that
annoying banner on top, if you want to get rid of it then I suggest using
notepad. But you can use easy designer as a way of previewing your pages
while your working on them if you don't have a program that will allow you to
view you pages.
These pages are made using I Frames. The main page has a
background and does not have a clear scrollbar. Only the pages that are
linked have the clear backs and scrolls. You main page has to have a code
for recognizing the clear color. This is an example of that kind of page.
If you copied and pasted this code, you should see a tiled
background with two X's and two white boxes. The X's are you pictures that
you would need to link into the code. The part of the code that you need
to modify to add your pictures look like this.
<IMG src="http://members.aol.com/yourscreenname/images/yourpic.jpg"
BORDER=0 style="z-index: 1" width="500" height="180">
and
<img src="http://members.aol.com/yourscreenanme/images/yourpic.gif">
Now onto the white boxes.
You can move these around on the page and make them
different sizes if you want. Look for this part of the code. With
this you can change width and height to whatever you think looks good and see
where it says position absolute by changing the numbers there, changes where the
white box is positioned on your main page.
<iframe FRAMEBORDER="0" width="230"
height="660"src="http://members.aol.com/yourscreenname/links.htm" name="links"
allowTransparency scrolling="no" align="top" style="filter:chroma
(color=#00ff00)" style="position:absolute; top:740px; left:-5px"></iframe>
That is the code for the links page. You'll need to make
a page that has your links on them, you can add more stuff on that page such as
a hit counter or like I did, I added my tag board also. I'll explain how
to make the background for your links page later on down the page, right now
we're just doing the main page.>
This is the part of the code that links the updates.>
<iframe name="I1" FRAMEBORDER="0" width="570"
height="450"src="http://members.aol.com/yourscreenname/updates.htm"
name="updates" allowTransparency scrolling="yes" align="top" style="filter:chroma
(color=#00ff00)" style="position:absolute; top:680px; left:280px"></iframe>
Now once you've gotten the size and positions you are wanting
save the page in notepad as index. Ok now its time to make the links
page and the updates page.
/p>
For the links page you can use mine, you'll just need to put
your own links in.
Notice this part of the code
<style type="text/css">
<!-- BODY {background:none transparent;color:#00ff00}-->
<!--
BODY{
scrollbar-face-color:#00ff00;
scrollbar-arrow-color:#000000;
scrollbar-track-color:#00ff00;
scrollbar-shadow-color:#000000;
scrollbar-highlight-color:#00ff00;
scrollbar-3dlight-color:#00ff00;
scrollbar-darkshadow-Color:#000000;
}
-->
</style>
This is the part that gives you the clear background and
scrollbar. I'm using the color 00ff00 which is lime green to be the color
the code recognizes to be clear.
Once you have the links linked to what you want them to link
to then you can save the page in notepad as links.
Now for the updates page, you can use my code here too, just
add whatever it is that you are wanting to say.
Now save this page in notepad as updates.
BTW: If you are previewing each page separately you'll
be seeing a lot of green, it's not till they are all pulled together that the
green goes away and the clear effect begins.
OK now you got your pages saved in notepad, now you need to
upload them. Go to keyword, type in my ftp then click on
see my ftp. Now click on upload. Type in index.htm and
click continue, now click on select file, now find your page
you have saved and double click it, now click OK and your page will upload to
your ftp. Now repeat those steps for links.htm and updates.htm
Once you have all 3 pages uploaded you can go to your
members.aol.com/yourscreenname/index
and view your page.
Now for any and all pages that you want previewed in your I
Frame you need to add this code
<style type="text/css">
<!-- BODY {background:none transparent;color:#00ff00}-->
<!--
BODY{
scrollbar-face-color:#00ff00;
scrollbar-arrow-color:#000000;
scrollbar-track-color:#00ff00;
scrollbar-shadow-color:#000000;
scrollbar-highlight-color:#00ff00;
scrollbar-3dlight-color:#00ff00;
scrollbar-darkshadow-Color:#000000;
}
-->
</style>
if you don't then the other pages won't have the clear back
and scroll.
<~~~Rewind
