Safari Problem // Radar Map Layer

  • Can't push the Layer Map Radar in Front of all divs/objects. It is hold in krpano swf.
    The map should be the foremost object.
    Z-index/Zorder does not work.
    When i push the "layer" map plugin in dev tool to the main html than it works.

    It works in all browsers but safari dont want...

    <!-- RADAR -->
    <layer name="map" url="map.png" keep="true" align="leftbottom" x="42" y="23" width="150" height="prop" handcursor="false" scalechildren="true" maskchildren="true"
    onloaded="set(image_w,get(plugin[map].imagewidth));set(image_h,get(plugin[map].imageheight));set(map_loaded,true);adapt_map();">
    <layer name="spot3" url="mappoint.png" align="lefttop" edge="center" x="27" y="200" zorder="999" onclick="loadscene(scene_IMG_9598_Panorama, null, MERGE, BLEND(1));" />
    <layer name="spot5" url="mappoint.png" align="lefttop" edge="center" x="67" y="180" zorder="999" onclick="loadscene(scene_IMG_9651_Panorama, null, MERGE, BLEND(1));" />
    <layer name="spot7" url="mappoint.png" align="lefttop" edge="center" x="27" y="160" zorder="999" onclick="loadscene(scene_IMG_9678_Panorama, null, MERGE, BLEND(1));" />
    <layer name="spot8" url="mappoint.png" align="lefttop" edge="center" x="27" y="137" zorder="999" onclick="loadscene(scene_IMG_9690_Panorama, null, MERGE, BLEND(1));" />
    <layer name="spot9" url="mappoint.png" align="lefttop" edge="center" x="27" y="115" zorder="999" onclick="loadscene(scene_IMG_9702_Panorama, null, MERGE, BLEND(1));" />

    </layer>

    <!-- radar plugin, will be assigned to be a child of spot -->
    <layer name="radar" keep="true" visible="true"
    url="plugins/radar.swf"
    alturl="plugins/radar.js"
    align="center" edge="center"
    fillcolor="0xffffff" fillalpha="0.4" scale="0.2"
    headingoffset="110"
    editmode="true"
    />

    <!-- activated spot image (child of the radar layer) -->
    <layer name="activespot" parent="radar" url="mappointactive.png" keep="true" align="center" edge="center" scale="1" />

    <!-- activatespot action - %1 = the current spot, %2 = the current radar heading -->
    <action name="activatespot">
    set(layer[radar].parent, layer[%1]);
    set(layer[radar].visible, true);
    set(layer[radar].heading, %2);
    </action>


    This is the CSS in dev tool:

    position: absolute;
    z-index: 3001;
    overflow: hidden;
    opacity: 1;
    cursor: default;
    pointer-events: auto;
    background-image: url(http://192.168.2.151:8090/map.png);
    width: 150px;
    height: 248px;
    background-size: 150px 248px;
    transform: translateZ(1000000000000px) translate(42px, 623px) translate(-75px, 124px) rotate(0deg) translate(75px, -124px);
    background-position: 0px 0px;

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!