Okey, its like this...
I am doing a website, and everything is finnished except from the navigation bar.
The problem is that I dont know I should make links from one picture
It looks like this
And dont whine about the font, because I did it in 5 minutes, so... 
My question is:
How do I make the plain text to links?
Well, anyone got an idea?
HTML code?, any program I should download?, php code?
xD
post here or PM me
Thanks in advance,
Yours,
Jobbin I am not goin to complain about the fonts, but i must complain about the color, i mean the second one is almost invisible.
And about the solution, if u want to have it as a picture i will recommend to use photoshop and try to slice it up to table, then u can add events to each section.
First off this should be in Scripting!
If you have Fireworks it makes it so much easier, all you have to do is create Slices, and then in Fireworks you can link it, then export it as a HTML file, the slice tool looks like a craft knife, it creates green blocks.
Moved to scripting 
| mathiaus wrote: |
| Moved to scripting |
I could have done that a loooooong time ago if I was a moderator. Hint Hint Bondingsif the picture size is small (as it should be (i believe you know how to use image ready)) it is much easier to make an image map. You just draw a figure over a part of an image and give it a link. Very easy to do in dreamweaver, it takes under a minute
I didn1t do this in a while, but i believe that when you click on the picture in the lower left part, in the toolbar you have an option for the image map. Go look for it
Hope this helped http://www.w3schools.com/tags/tag_map.asp shows you how to do it by hand if you're not afraid of getting your hands dirty with pixel value hotspots. You need to make an image map.
I can do this in a non-wysiwyg editor, but I won't touch dreamweaver or any code that it generated.
I could however write the code from scratch...
but its too much touble to do for free
You've got two options here:
1: Remove the text from that picture and replace it als html-links on a layer (just play some css).
2: Make an image map (Dreamweaver includes a nice tool to help you with it).
| ocalhoun wrote: |
You need to make an image map.
I can do this in a non-wysiwyg editor, but I won't touch dreamweaver or any code that it generated. |
Out of curiousity... why not use dreamweaver's coding?
I'm just getting back into webscripting and such -- and I've mostly been using Photoshop's ImageReady to do my slices, etc., for the layer-based image maps I've needed -- but is there some reason to do it by hand? Is just Dreamweaver a bad program for code generation, or would you not save an ImageReady document as html as well? (And why?) It just seems that finding all the coordinates, doing all the rollovers, etc., would take an unnecessarily long time if you were hand coding instead of letting adobe generate them for you...option1: make an image map
option2: split the image in several images and use 1 link each image.
| TRANScend wrote: |
Out of curiousity... why not use dreamweaver's coding?
I'm just getting back into webscripting and such -- and I've mostly been using Photoshop's ImageReady to do my slices, etc., for the layer-based image maps I've needed -- but is there some reason to do it by hand? Is just Dreamweaver a bad program for code generation, or would you not save an ImageReady document as html as well? (And why?) It just seems that finding all the coordinates, doing all the rollovers, etc., would take an unnecessarily long time if you were hand coding instead of letting adobe generate them for you... |
Some people think that dreamweaver generates messy code by adding some extra tags and that is bad for your website because it will make the page be larger...yeah...with a few kb in plus...whatever...there is a whole discution on this topic somewhere on these forums ...but my opinion is that the ease of use of dreamweaver`s ability to draw image maps overweighs any other arguments....And others of us boycott the software based on principle aswell.
why boycott a very good software????
Dreamweaver is the best wb editor around...just because it is expensive that doesn`t mean you must"boycott" it as you say so.....
use an image map to make the links
I also had problem with dreamweaver too, all the script is too hard to understand. I cannot use it. I use microsoft frontpage at school but that software is too expensive to buy, any other software ya advice?
Okey, I've done a image map, but now I got another problem.
I am using Dreamweaver to do most of my work.
NOTE: I didnt do this post to have your feedback about the design or anything, I know it isnt the best, but it's my first time.
Well, I've inserted the image map like this.
So far all good, but now I wanna insert my news content beside the navigation bar.
Like this:
I'll insert a PHP script in dreamweaver
| Code: |
| <? include ("news_content.php"); ?> |
The result wasnt what I had expected, the news content goes below the navigation bar, and I've tried almost everything to get it beside the nav bar.
Well, in dreamweaver it seems that you cant put any object on the same line as a image, am I right?
I really need help on this one.
Thanks in advance,
Yours,
Jobbin Bring
Up
My
Post
Please, cant anyone help me?, when I've done this, the homepage is ready to host...
That's why you shouldn't use dreamweaver... Don't know how dreamweaver works, but you should place that code in a <div> tag, then place it next to the image (using css normally, don't know if dreamweaver can do it too).
Normal code would be:
| Code: |
<div style="position: absolute; left: 30%; right: 95%; top: 30%;">
<? include ("news_content.php"); ?>
</div> |
Not sure about the left, right and top tough, you can change them if necessary | Stubru Freak wrote: |
That's why you shouldn't use dreamweaver... Don't know how dreamweaver works, but you should place that code in a <div> tag, then place it next to the image (using css normally, don't know if dreamweaver can do it too).
Normal code would be:
| Code: | <div style="position: absolute; left: 30%; right: 95%; top: 30%;">
<? include ("news_content.php"); ?>
</div> |
Not sure about the left, right and top tough, you can change them if necessary |
Oh my god, I love you Stubru Freak!
I've had this problem like a month, and have tried hours to get the sulotion, again thanks!
Yours,
Happy,
lil,
Jobbin | Jobbin wrote: |
| Stubru Freak wrote: | That's why you shouldn't use dreamweaver... Don't know how dreamweaver works, but you should place that code in a <div> tag, then place it next to the image (using css normally, don't know if dreamweaver can do it too).
Normal code would be:
| Code: | <div style="position: absolute; left: 30%; right: 95%; top: 30%;">
<? include ("news_content.php"); ?>
</div> |
Not sure about the left, right and top tough, you can change them if necessary |
Oh my god, I love you Stubru Freak!
I've had this problem like a month, and have tried hours to get the sulotion, again thanks!
Yours,
Happy,
lil,
Jobbin |
No problem 
here try this
| Quote: |
<script type="text/javascript">
function writeText(txt)
{
document.getElementById("desc").innerHTML=txt
}
</script>
<center><img src ="/images/ImgMp.gif"
width ="1024" height ="120"
alt="Navigation"
usemap ="#imgmp" />
<map id ="imgmp"
name="imgmp">
<area shape ="rect" coords ="19,16,151,103" onmouseover="writeText('')"
href =""
alt="" />
<area shape ="rect" coords ="198,16,298,103" onmouseover="writeText('')"
href ="i"
alt="" />
<area shape ="rect" coords ="307,16,441,103" onmouseover="writeText('')"
href =""
alt="" />
<area shape ="rect" coords ="474,16,678,103" onmouseover="writeText('')"
href =""
alt="" />
<area shape ="rect" coords ="715,16,861,103" onmouseover="writeText('')"
href =""
alt="" />
<area shape ="rect" coords ="889,16,1003,103" onmouseover="writeText('')"
href ="" target="_blank"
alt="" />
</map></center> |
for the numbers the format is x1,y1,x2,y2
So break out image ready or photoshop and get the xy coordinates, and this just makes a bunch of rectangles that are links in the picture, if server 2 gets working any time soon, you can see the results at [url]kho.frih.net[/url] though the links lead to non existing pages 
