AnsweredAssumed Answered

Javascript 3.x  mouse over / hover interferes with click/touch

Question asked by hydrotasmania on Sep 15, 2019

Hi all,

I'm not a web developer, but I am tasked with supporting a javascript 3.x web application built by someone else  The web app is a map with feature layers, with mouse-over functions to pop up the feature name. When a user clicks/touches a feature, the app opens a URL from the feature in a new window.

The app was working fine until a week or so ago, but now the click/touch doesn't seem to work on Android or latest version of iOS, but it works on Firefox on Android. Still works fine in IE/Chrome. When we disable the mouse over, the pop up works seems to work ok on the mobile devices.

 

Has anyone else experienced this or know how to overcome the issue? The problem with using the click() is that IE does not seem supported?

 

Any help much appreciated.

Thanks,

Inga

 

Code extracts below:

 

        // hover script
        //listen for when the onMouseOver event fires on the countiesGraphicsLayer
        //when fired, create a new graphic with the geometry from the event.graphic and add it to the maps graphics layer
        Featurelayer_RainGauges.on("mouse-over", function (evt) {
            // roll over icon
            rolloverIcon(evt,sym_rain_roll);

            // site name popup on hover
            siteNamePopup(evt);

            // open URL on click function
            // openURL(evt);
        });
        Featurelayer_RainGauges.on("mouse-out",closeDialog);
        Featurelayer_LakeLevels.on("mouse-over", function (evt) {
            // roll over icon
            rolloverIcon(evt,sym_level_roll);

            // site name popup on hover
            siteNamePopup(evt);

            // open URL on click function
            // openURL(evt);
        });
        Featurelayer_LakeLevels.on("mouse-out",closeDialog);
        Featurelayer_Other.on("mouse-over", function (evt) {
            rolloverIcon(evt,sym_other_roll);

            // site name popup on hover
            siteNamePopup(evt);

            // open URL on click function
            // openURL(evt);
        });
        Featurelayer_Other.on("mouse-out",closeDialog);
        Featurelayer_RiverFlowRate.on("mouse-over", function (evt) {
            // roll over icon
            rolloverIcon(evt,sym_flow_roll);

            // site name popup on hover
            siteNamePopup(evt);

            // open URL on click function
            // openURL(evt);
        });
        Featurelayer_RiverFlowRate.on("mouse-out",closeDialog);

        function rolloverIcon(evt,graphic_icon){
//                var highlightGraphic = new Graphic(evt.graphic.geometry, graphic_icon,evt.graphic.attributes);
//                map.graphics.add(highlightGraphic);
        }

        // name hover popup
        function siteNamePopup (evt){
            var t = "<b>${Name}</b>";

            var content = esriLang.substitute(evt.graphic.attributes, t);
            dialog.setContent(content);

            domStyle.set(dialog.domNode, "opacity", 0.85);
            dijitPopup.open({
                popup: dialog,
                x: evt.pageX,
                y: evt.pageY
            });
        }

        // function to hide popup boxes. Used when hovering is finished
        function closeDialog() {
            map.graphics.clear();
            dijitPopup.close(dialog);
        }

 

 

    // open URL on click function
   function openURL(evt) {
      window.location.href = evt.graphic.attributes["plot"];
        }

Outcomes