Image Mapper Responsive - Post ID 286894

User 244626 Photo


Registered User
811 posts

You can use Image Mapper to create a image map and use the information generated on export to combine it with Mapify.js to create some awesome hover and popup effects.

http://gluexp.coffeecup.com/mapify/
Bootstrap 5 CSS Grid.
User 2699991 Photo


Registered User
4,782 posts
Online Now

Twinstream wrote:
You can use Image Mapper to create a image map and use the information generated on export to combine it with Mapify.js to create some awesome hover and popup effects.

http://gluexp.coffeecup.com/mapify/


Hi twinsteam the problem is nothing happens on my mobile except when I hover over the flower I get a message saying cc refused to connect. What's supposed to happen?
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 122279 Photo


Senior Advisor
14,447 posts

Working fine on my iPhone6. Clicking on the flower opens the help page for the CC image mapper.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2699991 Photo


Registered User
4,782 posts
Online Now

Inger wrote:
Working fine on my iPhone6. Clicking on the flower opens the help page for the CC image mapper.


must be my internet connection then.

but I do things like that all the time just using SD no image mapper no JS just images & transitions
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 244626 Photo


Registered User
811 posts

Try this one. It shows better capability of Image Mapper.

https://gluexp.coffeecup.com/lombok/
Bootstrap 5 CSS Grid.
User 187934 Photo


Senior Advisor
20,181 posts
Online Now

This was done with the html editor.
https://ericrohloff.com/coffeecup/ccfor … nsive.html
and this one I did for another CC user.
https://ericrohloff.com/coffeecup/ccfor … r/tooltip/
And another twist on the first one.
https://ericrohloff.com/coffeecup/ccfor … xtpop.html

I like that last map Twinstream.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

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 personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2719032 Photo


Registered User
11 posts

First, sorry for posting to the wrong forum before.
I have and are using Image mapper, and it is great.
I am having trouble now trying to get all my maps working with HTTPS:
I have some complex maps that came over well:
(https://truthrightlydivided.ca/wp-conte … nsive.html)
But some that work fine in HTTP: but not HTTPS:
(http://truthrightlydivided.ca/wp-conten … nsive.html
https://truthrightlydivided.ca/wp-conte … nsive.html)
I tried to add a movie about the failure but it is too big.

any help would be appreciated.
User 187934 Photo


Senior Advisor
20,181 posts
Online Now

Can you explain what the issue is with these maps as they seem to work for me.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

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 personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com

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.