Snarkpit Forum Index » General Banter » A little help with some HTML
A little help with some HTML
1
Post Reply
Quote
 Re: A little help with some HTML
Posted by SnarkSephiroth on Sat Sep 24th at 10:46pm 2005

Allright, so heres the deal. I am making a site for myself. I am learning as I go and I am doing ok. I have made a Navagation bar that runs across the top of the site. What I am having trouble figuring out is how to get rollover buttons incorperated into this. I already have rollover buttons for it, but I can't incorperate them.

Here they are:

http://www.theoryofinsanity.co.nr/rollovertest.htm

The bar on the top is the Nav bar. Actually, its really just a picture. Below it is all of the animated buttons I want on it. But how do you do it?




Quote
 Re: A little help with some HTML
Posted by French Toast on Sat Sep 24th at 10:49pm 2005

Hey, haven't seen you for awhile! I can't help you... but hey!




Quote
 Re: A little help with some HTML
Posted by Crono on Sat Sep 24th at 10:53pm 2005

You have to make a roll over image map. With image coordinates.

However, I should let you know, doing rollovers, especially on an image map, is very slow. Since, the rollover images aren't loaded until the mouseover stuff is executed (but you can use a little JS to fix that). In the case of a rollover image map, that's ... how many menu options do you have? 5? So, that means (it's 10KB) you need 6 separate images (of the full menu bar) So, tha's 60KB, you can imagine how this gets consuming image

Anyway, try it out though, it's fun to mess around with, I'd personally suggest, once you get more comfortable and start messing with CSS, that you do rollovers that way. No images required, for the most part.

ANYWAY

Here, check out this page: http://www.htmlgoodies.com/tutorials/image_maps/article.php/3479771

I just skimmed it and it looks like it has what you want ... with some helpful links too.

At least, that should get you started image


Blame it on Microsoft, God does.



Quote
 Re: A little help with some HTML
Posted by SnarkSephiroth on Sat Sep 24th at 10:53pm 2005

Yeah I've been really busy with work and school. Haven't been around as much as I use to.

So how do I find out the coordinates so I can put the images in the right place? Thanks for that link, it helped alot.

So basicly all it is doing is declaring the images, and calling them in another function? Pretty neat. Never thought of it that way.




Quote
 Re: A little help with some HTML
Posted by Crono on Sun Sep 25th at 6:38am 2005

You get the coordinates from an image program, photoshop has given me some sketchy answers, but should work. I'm sure PSP and Gimp give coordniates as well. (You just need the upperleft hand corner for the selectable area(s) and the lower right hand corner)


Blame it on Microsoft, God does.



Quote
 Re: A little help with some HTML
Posted by SnarkSephiroth on Sun Sep 25th at 8:14am 2005

Crono, you're my life saver. I got it to work. Took me about 2 hours. I had to tweak the code quite a bit, but finally got it to work. Heres the link to check it out:

http://www.theoryofinsanity.co.nr/rollovertest.htm

Thanks so much again Crono! If I ever need help again, I'll be sure to ask you.




Quote
 Re: A little help with some HTML
Posted by Forceflow on Sun Sep 25th at 8:16am 2005

Coding rollovers on image maps is not very easy.
Why don't you use Flash ? I know some people might be against it, but it really is an easy way to create a navigation bar with rollover effects.

If you still want your button rollover effect to be (D)HTML, I'd suggest Fireworks.



:: Forceflow.be :: Nuclear Dawn developer



Quote
 Re: A little help with some HTML
Posted by SnarkSephiroth on Sun Sep 25th at 8:21am 2005

Well I just coded this and I don't feel like getting another program just so I can re-code it again. :P

Did it work for you Forceflow? And did it load fast enough; The buttons not the page.




Quote
 Re: A little help with some HTML
Posted by Crono on Sun Sep 25th at 8:49am 2005

No problem.

I'm glad you put that script in, even if it does make the page take a little longer to load, it isn't noticable at "rollover" time.

The coding part should be pretty fast once you know what you have to do.

As for altering the coordinates ... get another source for them, because the one you used isn't very accurate. It should be spot on. (At one point, I was able to make rollover image maps, like this one, in about ten minutes. I grabbed the coords when I made the image. Not too bad.)

Fireworks (and all that stuff) is cool and all ... but it's another program you'd have to install. Unless you already have it and use it activley ... there's not much point, it'd be too much of a hassle to install a program for this, fairly simple, process.


Blame it on Microsoft, God does.



Quote
 Re: A little help with some HTML
Posted by SnarkSephiroth on Sun Sep 25th at 9:40am 2005

It didn't take me 2 hours to get the coordinates, I think you misunderstood me. I meant that it took me two hours to get everything together and running properly. Code is so picky when it comes to things. Little errors can make it all come crashing down.

The page took so long to load, because its a free webhost. Free webhost = crappy load times. Oh well! Thats another problem for another day!

Yeah and I don't have Fireworks, so I am not going to DL a trial version or purchase a copy just to do what I have already achieved.




Quote
 Re: A little help with some HTML
Posted by Gaara on Mon Sep 26th at 8:04am 2005

Flash is probably the easiest for me personally for animated nav bars.


Reckless disregard for childrens well being, women and nothing but utter contempt for other cultures.




1
Post Reply