New to Kendo UI for jQuery? Start a free 30-day trial

MarkerDefaults.tooltip.animation

configuration

A collection of {Animation} objects, used to change default animations. A value of false will disable all animations in the widget.

markerDefaults.tooltip.animation

Object

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }],
        markerDefaults: {
            tooltip: {
                animation: false
            }
        },
        markers: [{
            location: [42, 27],
            tooltip: {
                content: "Foo"
            }
        }, {
            location: [40, 20],
            tooltip: {
                content: "Bar"
            }
        }]
    });
</script>

markerDefaults.tooltip.animation.close

Object

The animation that will be used when a Tooltip closes.

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }],
        markerDefaults: {
            tooltip: {
                animation: {
                  close: {
                    effects: "fade:out"
                  }
                }
            }
        },
        markers: [{
            location: [42, 27],
            tooltip: {
                content: "Foo"
            }
        }, {
            location: [40, 20],
            tooltip: {
                content: "Bar"
            }
        }]
    });
</script>

markerDefaults.tooltip.animation.open

Object

The animation that will be used when a Tooltip opens.

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }],
        markerDefaults: {
            tooltip: {
                animation: {
                    open: {
                        effects: "fade:in",
                        duration: 1000
                    }
                }
            }
        },
        markers: [{
            location: [42, 27],
            tooltip: {
                content: "Foo"
            }
        }, {
            location: [40, 20],
            tooltip: {
                content: "Bar"
            }
        }]
    });
</script>

MarkerDefaults.tooltip.animation

markerDefaults.tooltip.animation

markerDefaults.tooltip.animation.close

markerDefaults.tooltip.animation.open

Related Members