HTML Help

elsachmo · Joined: 10 Apr 2009 Posts: 3

I'm a total beginner at html coding for my MySpace page, but I have figured out how to do some basic things. Here's my problem: I have my background .jpg in place, and I wanted to place clickable links on certain things on that background. I figured out a way to do this using some clear .gifs and some image mapping code. The thing I want to fix is that the .gifs I placed scroll up with the MySpace main page, while the background is fixed. Therefore, the links are only aligned correctly when the page is scrolled all the way to the top. Here's the page if you want to see what I mean. www.myspace.com/smokejumperstexas

And here's the code I currently have to at least get this accomplished. Thanks.

<span class="off">!-Create my Links using Clear Gif Image-!</span>
<div class="myL myL1" >
<a href="http://www.msplinks.com/MDFodHRwOi8vaXR1bmVzLmFwcGxlLmNvbS9XZWJPYmplY3RzL01aU3RvcmUud29hL3dhL3ZpZXdBbGJ1bT9pPTMwODU3MTk5NSZpZD0zMDg1NzE5OTQmcz0xNDM0NDE=">
<img src="http://x.myspace.com/images/clear.gif">
</a></div>

<div class="myL myL2">
<a href="http://www.msplinks.com/MDFodHRwOi8vaXR1bmVzLmFwcGxlLmNvbS9XZWJPYmplY3RzL01aU3RvcmUud29hL3dhL3ZpZXdBbGJ1bT9pPTMwNTU0MzA2MyZpZD0zMDU1NDI5OTImcz0xNDM0NDE=">
<img src="http://x.myspace.com/images/clear.gif">
</a></div>

<div class="myL myL3">
<a href="http://www.msplinks.com/MDFodHRwOi8vdHdpdHRlci5jb20vdGhlc21va2VqdW1wZXJz">
<img src="http://x.myspace.com/images/clear.gif">
</a></div>

<div class="myL myL4">
<a href="http://www.msplinks.com/MDFodHRwOi8vY2RiYWJ5LmNvbS93aWxkY2FyZG11c2lj">
<img src="http://x.myspace.com/images/clear.gif">
</a></div>

<div class="myL myL5">
<a href="http://www.msplinks.com/MDFodHRwOi8vY2RiYWJ5LmNvbS9zYWNo">
<img src="http://x.myspace.com/images/clear.gif">
</a></div>

<span class="off">!-Use style to position and size-!</span>
<style>

div.myL {z-index:8}

{!-position and size link 1-!}
div.myL1 {position:absolute; top:130px; left:40px}
div.myL1 img {width:140px; height:140px}

{!-position and size link 2-!}
div.myL2 {position:absolute; top:355px; left:40px;}
div.myL2 img {width:140px; height:140px}

{!-position and size link 2-!}
div.myL3 {position:absolute; top:475px; left:1060}
div.myL3 img {width:189px; height:27px}

{!-position and size link 2-!}
div.myL4 {position:absolute; top:320px; left:40}
div.myL4 img {width:100px; height:25px}

{!-position and size link 2-!}
div.myL5 {position:absolute; top:570px; left:50}
div.myL5 img {width:100px; height:20px}
</style>

<style type="text/css">body{background-color:transparent; background-image: url("http://elsachmo.com///1280x1024MyspaceBackLinks3.jpg"); background-attachment: fixed;}</style>