Hi!

Building such a site shouldn't be hard if you take step-by-step
approach.

I see the following features:
1. Scrolling-bars-free page with a big image;
2. Hotspots with popups;
3. Sliding menu;
4. Mini-map;
5. Scrolling with mouse wheel;

I'd do (1) by making a DIV with the size of the window, then I'd put
another DIV with a big image as a background, absolute positioning and
absolutely position hotspots within it. I've done something very
similar here:

http://www.figaro.kz/

Here's example HTML:

<div id="canvas">
  <div id="map"></div>
</div>

And CSS:

body,html { overflow-y: auto } /* IE fix for scrollbars */

/* Window-sized DIV */
#canvas {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        width: expression(documentElement.clientWidth+'px'); /* IE fix */
        height: 100%;
        height: expression(documentElement.clientHeight+'px'); /* IE fix */
        overflow: hidden;
        background: #EEE;
}

/* Map DIV centered on the screen */
#map {
        position: absolute;
        width: 5000px;
        height: 5000px;
        left: 50%;
        top: 50%;
        margin-left: -2500px;
        margin-top: -2500px;
        background: url(/images/big.gif);
}

(2) Because hotsports are just regular absolutely-positioned elements,
you can bind just about any Lightbox-like library to work with them.
I've last looked at:

http://livepipe.net/

But there seem to be dozens of libraries doing similat stuff.

(3) Scriptaculous can slide out the menu with Effect.SlideDown/SlideUp
or BlindDown/BlindUp.

(4) Mini-map can be done with Scriptaculous Draggable. In fact, I
dont' see why the big map shouldn't be draggable as well.

(5) Wheel can also be easily "intercepted" - here's the very first
link I've fished out of Google:

http://adomas.org/javascript-mouse-wheel/

Good luck with your project

- Baglan
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to