▼
Streaming live at 10am (PST)

Cartoon web sites with image map?

#1

Hi

I have been using MrSite to build sites the image samples below

These were created using image maps. Can you create image maps in Webflow, or produce something like the above but using a different technique?

Thank you

Scott

#2

Also, whilst I'm here asking, can you

embed video animation?

Create a fixed (non-moving/scrolling) background?

Have complete freedom where you place headers, navi bars, etc?

#3

Yes, everything, very easily.

No image-maps but you can put your bg in the site bg (body) and your main artwork in a container. Then absolute-pisitionned link boxes over what you want linking to where you want.

embed video animation: with video widget, from youtube and vimeo URLs, or with HTML widget using HTML5 video code (serach the forum for html5 video)

fixed background: check the fixed checkbox in the background settings panel

complete freedom to place what you want, as long as it's in the browser (:

#4

That sounds very good. The MrSite setup is very limiting, and webflow looks like it offers alot of creative freedom to set up a page however I want

#5

Are there any tutorials for doing things like the above?

#6

Or I suppose instead of creating one image and creating lots of links on it, could I create a central image and then place individual png images either side with links embedded in them.

#7

Tutorial is very easy, it's the magnificent position:absolute rule you need to master. here is it:

"Absolute positionned content is positionned regarding its closest positionned parent"

Every word counts.

So if you have a container, give it a class name and then position:relative. It changes nothing but now it's "positionned".

Put your image in it, or as a background of it.

Now put link blocks in it, give them dimensions, and set them to position:absolute. Now adjust the values to position them where you want, freely... their x/Y 0/0 position it the top left corner of the conteiner they're in.

#8

Hey, that's web design (:

I answered your question as you asked it, but the real answer shoud be : break down your graphical content, wtch the webflow tutorials video and build yourself a real modern kickass website! (because image-map websites are a bit of a cheat wink )

#9

Thanks for all the advice Vincent. much appreciated

closed #10