k-panelbar with images
HTML
<script src="http://cdn.kendostatic.com/2012.1.322/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.metro.min.css">
<script src="http://demos.kendoui.com/content/shared/icons/sports/baseball.png"></script>
<div id="panelbar-images"></div>
CSS
#panelbar-images {
width: 50%;
margin: 20px auto;
}
#panelbar-images{
border-color:Blue;
border-width:2px;
}
JavaScript
var img_source = "http://demos.kendoui.com/content/shared/icons/sports/baseball.png"
$("#panelbar-images").kendoPanelBar({
dataSource: [
{
text: "Item 1",
imageUrl: img_source,
items: [
{
text: "Sub Item 1.1",
valor: 2,
imageUrl: img_source},
{
text: "Sub Item 1.2",
valor: 3,
imageUrl: img_source}
]},
{
text: "Item 2",
imageUrl: img_source,
items: [
{
text: "Sub Item 2.1",
valor: 5,
imageUrl: img_source},
{
text: "Sub Item 2.2",
valor: 5,
imageUrl: img_source},
{
text: "Sub Item 2.3",
valor: 5,
imageUrl: img_source},
{
text: "Sub Item 2.4",
valor: 5,
imageUrl: img_source},
{
text: "Sub Item 2.5",
valor: 5,
imageUrl: img_source}
]}
]
});