Need A Code to enables you to write over an image

[seattle-west]

anyone know a code that enables you to write over a image because right now i had to use my header and nav as a backround (because there pictures) is there anyway i can write text over a picture? thanks alot

heres my website for reference, (the only reason the letters are on the nav bar is because i set it as a backround) someone please help

www.seattlewest.net

[Twey]

the only reason the letters are on the nav bar is because i set it as a backround

That's the best way to do it. You need to position them better, though.

[seattle-west]

well setting it as a backround causes alot of problems. because it makes it harder to put other stuff on the page. But is there any code though that does this so i can just have a nav image and write text over it...


well i used gimp to make the header and navigation bar idk well is there a way to make the image into sections so its editable cause i notice if you download website templates you can edit the navigation bars and type anything in them, i wonder if thats possible?. thanks

[Twey]

The problem is that the navigation bar and header are all one big image. Instead, try having the header as one image, and then have several elements (<li> is most correct here) underneath, each with one of those little boxes as a background and text in the foreground.

[chechu]

The problem is that the navigation bar and header are all one big image

Why not write the headers in the big image (Photoshop or whatever), and then make the links by mapping.
More here: http://www.dynamicdrive.com/forums/s...ad.php?t=17898

[V1SHAL]

Why not write the headers in the big image (Photoshop or whatever), and then make the links by mapping.
More here: http://www.dynamicdrive.com/forums/s...ad.php?t=17898

or...

write the links with an image editor and make each "box" a seperate image. And just link the entire image as if it were a button.

[Twey]

Why not write the headers in the big image (Photoshop or whatever), and then make the links by mapping.

Because that's using images as text, which is a bad idea. The same applies to V1SHAL's suggestion.

[chechu]

Because that's using images as text, which is a bad idea

Why is this a bad idea ?

[Twey]

Firstly, images take something on the order of several hundred times the bandwidth to send as their text equivalents. Secondly, there are browsers that cannot display images, although this can be fixed by using an appropriate alt. Thirdly, images can't be resized, take no account of the user's default font settings, and look very different at different display resolutions, having the same problems as pixel-sized text. The only way around this is to use SVG images with a relative size, but IE doesn't support SVG images yet.

[mdcloud]

you can also try layers. i have used them on occation

<script language="JavaScript" type="text/JavaScript">
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
</script>
<div id="Layer1" style="position:absolute; width:1200px; height:800px; z-index:1; visibility: visible; left: 0px; top: 0px;"> 
<img class="header1" src="pics/header1.jpg" width="1083" height="224" border="0">

</div>
<div id="Layer2" style="position:absolute; width:800px; height:800px; z-index:2; visibility: visible;">
<br><br>
text

</div>