Results 1 to 10 of 10

Thread: Image mapping?

  1. #1
    KTYorke
    Guest

    Image mapping?

    How can (should?) I do an image map?

    I can do it in something like HTML Robohelp but I don't have that at home... and this isn't for a help project.

    I have a graphic that I'd like the user to click on and have each different section of the graphic display a different page.

    Once I get that, I'd like to put a mouse over for each of the different sections of the graphic.
    Can I do this?? Do I need a program to do it? Is there an easier way to accomplish what I want to do?

    have fun

  2. #2
    Star Lounger
    Join Date
    Jan 2001
    Location
    Michigan, USA
    Posts
    75
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Image mapping?

    It just so happened that I just created my first page with an image map and mouse-overs. The image map was created in FrontPage and it was very easy, just point and click. The JavaScript for doing the mouse-over was put in by hand.
    As this is the first time I've ever done this, I'm no expert but here's <A target="_blank" HREF=http://www.chachich.com/jpnbike/tripmap.html>the page</A>, maybe it can help as an example of one way to do it.

    By the way, the animation is just an animated gif and has nothing to do with the image-map & javascript.

    BTW, sometimes IE doesn't work right with this page the first time and it has to be reloaded or IE has to be restarted. It seems to happen when a mouse-over happens before the page is fully loaded. If anybody has any idea how to fix this, I'd appreciate it.

  3. #3
    KTYorke
    Guest

    Re: Image mapping?

    You SO rock!!!
    That is a very cool page you have there... and no error messages for me on IE... [img]/S/shrug.gif[/img]

    What is it called in FrontPage? Is there a quick and dirty tutorial for it? I hate Front Page but I'll use it for something as complicated as this!! (I use it for complex tables too) it just adds too much of it's own junk for my liking.

    thanks a whole lot!! [img]/S/kiss.gif[/img]
    have fun

  4. #4
    Star Lounger
    Join Date
    Jan 2001
    Location
    Michigan, USA
    Posts
    75
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Image mapping?

    Thanks for the compliments!

    FrontPage isn't too bad once you tame it (set your compatibility settings to NS/IE 3.0) so that it doesn't put in all the extra CSS and Style [censored].

    The image map is pretty straight forward. In FP, it's called a "hot spot." In FrontPage, click on your image and make sure your Pictures toolbar is visible (View->Toolbars->Pictures). The toolbar will probably be at the bottom of your screen. The three buttons depicting a Rectangle, Circle and Polygon are all for making "hot spots." It should be fairly self-explanatory at that point. After you've made your map, you can always go to HTML view and grab the HTML and take it back to your usual html-editor (though most likely it would have a way to do this as well).
    Good luck.
    [img]/S/flatcat.gif[/img]
    --
    Wow, the word c r a p was automatically censored above -- talk about being politically correct?!

  5. #5
    KTYorke
    Guest

    Re: Image mapping?

    Hey there... I could just [img]/S/kiss.gif[/img] you!!
    I can't wait to get home and try it... alas, I have a concert to go to tonight and will be collecting more pics for this page I'm creating. I'll post the url here when I finish so you can say "Hey, I helped her do that!"
    Thank you SO much!!

    have fun

  6. #6
    Star Lounger
    Join Date
    Jan 2001
    Location
    Michigan, USA
    Posts
    75
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Image mapping?

    Watch it don't get me too excited! [img]/S/love.gif[/img]
    You're very welcome.
    Yes, please post the URL when you're ready & have fun at the concert.
    [img]/S/flatcat.gif[/img]

  7. #7
    KTYorke
    Guest

    Re: Image mapping?

    [img]/S/laugh.gif[/img] then maybe I WON'T post the page... [img]/S/wink.gif[/img]

    I'm going to a concert for a band my friends are in - Sharkys Machine - here in Jersey. I did their website and have been procrastinating on adding a Sharkettes page (of which I am one) I'm finally getting around to it and want to make it look REALLY cool. I'll post the url when it's done... in the mean time here's the band's page as it is now...
    <A target="_blank" HREF=http://www.sharkysmachineonline.com>http://www.sharkysmachineonline.com</A>

    You'll notice I have to go to the concert tonight to get a new photo of the band too... Halloween just doesn't cut it anymore... [img]/S/laugh.gif[/img]
    have fun

  8. #8
    KTYorke
    Guest

    Re: Image mapping?

    I'm in the process of creating the whole navigation thing... your suggestions and instructions are working like a charm!! Thanks again... I'll post the link when it's completed <img src=/S/smile.gif border=0 alt=smile width=15 height=15>
    have fun

  9. #9
    Plutonium Lounger Leif's Avatar
    Join Date
    Dec 2000
    Location
    U.K.
    Posts
    14,010
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Image mapping?

    Re: If anybody has any idea how to fix this, I'd appreciate it

    The <A target="_blank" HREF=http://javascript.internet.com/page-details/preload-page.html>javascript source</A> has this example to load an image before showing it. Might be of help.

  10. #10
    Star Lounger
    Join Date
    Jan 2001
    Location
    Michigan, USA
    Posts
    75
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Image mapping?

    BTW, I found out this week that the image maps are generated using the key word "POLYGON" which is not compatible with the HTML specification (even though IE and NS understand it).
    I would do a search and replace in HTML mode and change
    all POLYGON to POLY when you're done defining your map.
    Of course it's also a good idea to validate your HTML at www.w3c.org.

    mc

    p.s. Leif, thanks for the javascript source pointer.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •