Creating a Responsive Image Map with Image Mapper 5.0 Issue


Senior Advisor
2,540 posts

Hey fellow coffeecupers!

I have been at the for about 3 hours now and still banging my head against a wall. I have created a responsive image map using 5.0 software just under Female Directors and Investigative Documentaries. You will see an image with Canadian Panorama, Jury and Crossing Borders collouge with little file icons. I have mapped these icons to the respective pages. They work in full screen mode but as soon as I start shrinking the page they stop working.

http://riffa.ca/index.html

I have copied the exported folder to my server and pasted the scripts provided in the footer of the website. Maybe one of you guys have successfully used this software and can spot my mistake right away.

Thanks in advance
Steve:|
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA


Registered User
1,023 posts

Hey Steve,

I can't get the icons to don anything?

Byron


Registered User
1,023 posts

Sorry - under the Canadian Pan page

Probably a topic for RSD but under http://riffa.ca/investigative-documentary.html page how did you do the rollover effect for the individual movies? Nice

Byron


Senior Advisor
11,007 posts
Online Now

Steve, I haven't used the Image Mapper for quite some time. I'm on a laptop right now, and when I view the page, normal or full screen doesn't matter, the file icons don't do anything. Could it be that the coordinates move with the size of the image? Just a guess out of the blue...
Or, there might be something with the path to various bits and bobs.
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: http://www.horgenhonning.net/
Component sharing for RSD, RFF and RBB: http://www.horgenhonning.net/sharing/



Senior Advisor
11,007 posts
Online Now

Looks like the file jquery.rwdImageMaps.min.js is missing, or at least not where it is expected to be.
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: http://www.horgenhonning.net/
Component sharing for RSD, RFF and RBB: http://www.horgenhonning.net/sharing/



Senior Advisor
2,540 posts

Thanks Inger,

No that didn't work either. It only seems to be active at 1900px anything smaller and no go.

Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA


Senior Advisor
2,540 posts

Byron Tipping wrote:
Sorry - under the Canadian Pan page

Probably a topic for RSD but under http://riffa.ca/investigative-documentary.html page how did you do the rollover effect for the individual movies? Nice

Byron


Hi Byron,

This is easily achieved by placing a paragraph element in the column that has the background image. Setting the min height to the same as your image. Then set the properties of the paragraph to display none; and the hover to display:block; I also added some transitions in there.
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA


Senior Advisor
11,007 posts
Online Now

How did you solve the problem, Steve? I checked today, and the image map works for me at any screen size (Edge, Chrome and Ffx). And I see that the missing file has been put into the right place.
Was it just a matter of clearing the cache? ;)
Ha en riktig god dag!
Inger, Norway
My new honey site, built with RFF: http://www.horgenhonning.net/
Component sharing for RSD, RFF and RBB: http://www.horgenhonning.net/sharing/



Senior Advisor
17,827 posts

Works for me.;)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

Here's my S-Drive site with
examples of what can be accomplished in VSD.
http://progrower.coffeecup.com/
Here's my CoffeeCup SCCP Shop with examples of what can be done.
http://progrower.coffeecup.com/shop/
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personnel site used for testing and as an easy way to share photos.(RLM imported to RSD)
http://ericrohloff.com


Senior Advisor
2,540 posts

I didn't do anything. Yea I moved that file into place. Weird because the image mapper says nothing about that js having to be in the root folder.
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.