Fork me on GitHub

Clickable map with pop-up layer  Bottom

  • Hi

    Zikula 1.2.0
    Theme: SeaBreeze


    I’m trying to add a clickable map (area, shape=”rect” coords=”xyz” etc.) as a new page (Pages module) to my site. When I move the mouse over certain areas of the map, I’d like to pop-up a layer with additional information.

    In head.html of my theme I’m referring to the necessary .css and .js files.

    Outside of Zikula this works fine, but within Zikula the layers do not pop-up on mouse over. The area is being recognized (mouse pointer changes to hand pointer), but no layer pops up.

    I
    - activated the script tag and area tag in HTML settings
    - tried a different theme
    - checked page source – looks OK, it’s all there

    What else can I try or look at?
    Any ideas?

    --
    nitz
  • Do you have an online URL to look at? That could help a lot.

    --
    campertoday.nl, Module development, Dutch Zikula Community
  • No sorry, no online URL yet.
    What else can I offer?

    --
    nitz
  • You tried a different theme. It also didn't work there? What other javascripts do you have loaded. There might be some interference ?

    --
    campertoday.nl, Module development, Dutch Zikula Community
  • Yes, tried a different theme.
    I have installed Scribite 3.1, Menutree 2.3 and zWebstore 1.0.112
    Think that's all ...?

    --
    nitz
  • I mean the source of the page with the clickable map in it. If you look at the source what stylesheets and javascripts are there and what script did you use for the popups? Maybe you can post the header part of you page here in code tags

    --
    campertoday.nl, Module development, Dutch Zikula Community
  • Quote

    There might be some interference ?


    Yes, but I do not know how to find out unless I do a fresh Zikula installation without Scribite, Menutree and zWebstore icon_confused
  • Sorry, got you wrong there.
    The forum does not let me post code, no matter if I use code tags.

    The following files are loaded in the header tag:

    - themes/SeaBreeze/style/style.css
    - images/maps/popupmenu.css (from dynamicdrive.com, I use this for the map)
    - images/maps/jquery.min.js (from dynamicdrive.com, I use this for the map)
    - images/maps/popupmenu.js (from dynamicdrive.com, I use this for the map)
    - modules/scribite/pnstyle/style.css
    - modules/News/pnstyle/style.css
    - modules/menutree/pnstyle/cssplay_flyout_ltr.css
    - system/Users/pnstyle/style.css
    - javascript/style.css

    Thanks for your patience!

    --
    nitz
  • Zikula uses prototype as Javascript library normally. I can imagine that it interferes with you jQuery here, although you don't seem to be loading any prototype files here.
    You can also check to see if there is some z-index problem with you popup script. Like when seabreeze has z-index values defined and the popup assumes some value of z-index as well that is too low.

    --
    campertoday.nl, Module development, Dutch Zikula Community
  • Here is what I did last night:

    1. I deactivated (unloaded) the above .css files one by one - no difference.
    2. I then created a new HTML block and tried the code in there - this works fine

    So I belive the problem is somewhere with the News and/or Pages module. I'll give it another try!

    --
    nitz
  • Do you have Firebug enabled in firefox (if you also use firefox)? Or safari that also has a good code inspecter. That can be a very helpful tool to see what is going on in the page. You can inspect the map element and see what CSS is valid for that part and than try to find the conflicting stuff.

    --
    campertoday.nl, Module development, Dutch Zikula Community

This list is based on users active over the last 60 minutes.