or
var tooltip = $("#Button_Settings_ID").kendoTooltip({ filter: "input", width: 210, height: heigth, position: "bottom", autoHide: false, showOn: "click", callout: true, content: kendo.template($("#Button_Settings_template").html()) }).data("kendoTooltip");<head> <title></title> <link href="Content/kendo/2013.1.319/kendo.default.min.css" rel="stylesheet" type="text/css" /> <link href="Content/kendo/2013.1.319/kendo.common.min.css" rel="stylesheet" type="text/css" /> <script src="Script/jquery-1.8.3.min.js" type="text/javascript"></script> <script src="Script/kendo/2013.1.319/kendo.all.min.js" type="text/javascript"></script></head><body> <div id="example" class="k-content"> <div class="demo-section"> <div id="agglomerations"> <a href="#" title="Canton - 26,300,000" id="canton"></a> <a href="#" title="Jakarta - 25,800,000" id="jakarta"></a> <a href="#" title="Mexico City - 23,500,000" id="mexico"></a> <a href="#" title="Delhi - 23,500,000" id="delhi"></a> <a href="#" title="Karachi - 22,100,000" id="karachi"></a> <a href="#" title="New York - 21,500,000" id="newyork"></a> <a href="#" title="Sao Paulo - 21,300,000" id="saopaolo"></a> <a href="#" title="Mumbay/Bombay - 21,100,000" id="bombay"></a> <a href="#" title="Los Angeles - 17,100,000" id="losangeles"></a> <a href="#" title="Osaka - 16,800,000" id="osaka"></a> <a href="#" title="Moscow - 16,200,000" id="moscow"></a> </div> </div> <script> $(document).ready(function () { var tooltip = $("#agglomerations").kendoTooltip({ filter: "a", width: 120, position: "top" }).data("kendoTooltip"); tooltip.show($("#canton")); $("#agglomerations").find("a").click(false); }); </script> <style scoped="scoped"> .demo-section { width: 692px; } #agglomerations { position: relative; width: 692px; height: 480px; margin: 0 auto; background: url('../../content/web/tooltip/world-map.jpg') no-repeat 0 0; } #agglomerations a { position: absolute; display: block; width: 12px; height: 12px; background-color: #fff600; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; border: 0; -moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.5); -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.5); box-shadow: 0 0 0 1px rgba(0,0,0,0.5); -moz-transition: -moz-box-shadow .3s; -webkit-transition: -webkit-box-shadow .3s; transition: box-shadow .3s; } #agglomerations a:hover { -moz-box-shadow: 0 0 0 15px rgba(0,0,0,0.5); -webkit-box-shadow: 0 0 0 15px rgba(0,0,0,0.5); box-shadow: 0 0 0 15px rgba(0,0,0,0.5); -moz-transition: -moz-box-shadow .3s; -webkit-transition: -webkit-box-shadow .3s; transition: box-shadow .3s; } #canton { top: 226px; left: 501px; } #jakarta { top: 266px; left: 494px; } #mexico { top: 227px; left: 182px; } #delhi { top: 214px; left: 448px; } #karachi { top: 222px; left: 431px; } #newyork { top: 188px; left: 214px; } #saopaolo { top: 304px; left: 248px; } #bombay { top: 233px; left: 438px; } #losangeles { top: 202px; left: 148px; } #osaka { top: 201px; left: 535px; } #moscow { top: 153px; left: 402px; } #canton:hover, #jakarta:hover, #mexico:hover, #delhi:hover, #karachi:hover, #newyork:hover, #saopaolo:hover, #bombay:hover, #losangeles:hover, #osaka:hover, #moscow:hover { z-index: 10; } </style> </div></body></html>
var dsBuecherAT = new kendo.data.DataSource( { transport: { read: { url: "/api/t_buechers", dataType: "json" } } }); $("#buecherAT").kendoTabStrip({ dataTextField: "Buch", dataContentField: "Buch_ID", dataSource: dsBuecherAT });var dataSource = new kendo.data.DataSource({ data: [ { name: "Jane Doe" }, { name: "John Doe" } ], filter: { field: "name", operator: "startswith", value: "Jane" }});var dataSource = new kendo.data.DataSource({ data: [ { name: "Jane Doe" }, { name: "John Doe" } ], filter: { "field": "name", "operator:" "startswith", "value:" "Jane" }});//we are getting the kapitels function getKapitels(buch_ID) { alert(buch_ID); var dsKapitels = new kendo.data.DataSource({ transport: { read: { url: "/api/t_kapitels", dataType: "json" } } }); $("#kapitel").kendoTabStrip({ dataTextField: "Kapitel_ID", dataContentField: "Buch_ID", dataSource: dsKapitels.filter({ field: "Buch_ID", operator: "eq", value: "1" }) }) }//we are getting the kapitels function getKapitels(buch_ID) { alert(buch_ID); var dsKapitels = new kendo.data.DataSource({ transport: { read: { url: "/api/t_kapitels", dataType: "json" } }, filter: { field: "Buch_ID", operator: "eq", value: "1" } }); $("#kapitel").kendoTabStrip({ dataTextField: "Kapitel_ID", dataContentField: "Buch_ID", dataSource: dsKapitels }) }.k-grid table tr:hover{ background: #ffb76b; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmYjc2YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmE3M2QiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmY3YzAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmN2YwNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background: -moz-linear-gradient(top, #ffb76b 0%, #ffa73d 100%, #ff7c00 100%, #ff7f04 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb76b), color-stop(100%,#ffa73d), color-stop(100%,#ff7c00), color-stop(100%,#ff7f04)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ffb76b 0%,#ffa73d 100%,#ff7c00 100%,#ff7f04 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ffb76b 0%,#ffa73d 100%,#ff7c00 100%,#ff7f04 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ffb76b 0%,#ffa73d 100%,#ff7c00 100%,#ff7f04 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffb76b 0%,#ffa73d 100%,#ff7c00 100%,#ff7f04 100%); /* W3C */ cursor:pointer;}