Ist es möglich, Animation in Kendo Tabstrip zu deaktivieren, wenn wir die tab.we Zugabe haben dies unter Code versucht @ (Html.Kendo(). TabStrip() .Name ("TabStrip")Kendo MVC Tabstrip Animation deaktivieren?
.Events(events => events
.Select("onSelect")
)
.Animation(animation =>
{
animation.Enable(false);
})
)
aber es funktioniert nicht für mich.please bieten Lösung dafür.
Unten habe ich Javascript-Konfiguration verwendet, um Ihren Zweck zu erreichen. Es hat perfekt funktioniert. Dann füge ich eine MVC-Version desselben Codes ein. Es hat auch gut funktioniert. Ich denke also, dass die Quelle des Problems dem Rest Ihrer Code- oder Kendo-Version zugrunde liegt. JavaScript Konfiguration hier:
<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/tabstrip/index">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.mobile.min.css" />
<script src="//kendo.cdn.telerik.com/2016.3.1118/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.3.1118/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example">
<div class="demo-section k-content">
<div id="tabstrip">
<ul>
<li class="k-state-active">
Paris
</li>
<li>
New York
</li>
<li>
London
</li>
<li>
Moscow
</li>
</ul>
<div>
<span class="rainy"> </span>
<div class="weather">
<h2>17<span>ºC</span></h2>
<p>Rainy weather in Paris.</p>
</div>
</div>
<div>
<span class="sunny"> </span>
<div class="weather">
<h2>29<span>ºC</span></h2>
<p>Sunny weather in New York.</p>
</div>
</div>
<div>
<span class="sunny"> </span>
<div class="weather">
<h2>21<span>ºC</span></h2>
<p>Sunny weather in London.</p>
</div>
</div>
<div>
<span class="cloudy"> </span>
<div class="weather">
<h2>16<span>ºC</span></h2>
<p>Cloudy weather in Moscow.</p>
</div>
</div>
</div>
</div>
<style>
.sunny, .cloudy, .rainy {
display: block;
margin: 30px auto 10px;
width: 128px;
height: 128px;
background: url('../content/web/tabstrip/weather.png') transparent no-repeat 0 0;
}
.cloudy{
background-position: -128px 0;
}
.rainy{
background-position: -256px 0;
}
.weather {
margin: 0 auto 30px;
text-align: center;
}
#tabstrip h2 {
font-weight: lighter;
font-size: 5em;
line-height: 1;
padding: 0 0 0 30px;
margin: 0;
}
#tabstrip h2 span {
background: none;
padding-left: 5px;
font-size: .3em;
vertical-align: top;
}
#tabstrip p {
margin: 0;
padding: 0;
}
</style>
<script>
$(document).ready(function() {
$("#tabstrip").kendoTabStrip({
animation: false
});
});
</script>
</div>
</body>
</html>mit MVC Razor, versuchen Sie dies:
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Animation(a=>a.Enable(false))
.Items(tabstrip =>
{
tabstrip.Add().Text("Paris")
.Selected(true)
.Content(@<text>
<div class="weather">
<h2>17<span>ºC</span></h2>
<p>Rainy weather in Paris.</p>
</div>
<span class="rainy"> </span>
</text>);
tabstrip.Add().Text("New York")
.Content(@<text>
<div class="weather">
<h2>29<span>ºC</span></h2>
<p>Sunny weather in New York.</p>
</div>
<span class="sunny"> </span>
</text>);
tabstrip.Add().Text("Moscow")
.Content(@<text>
<div class="weather">
<h2>16<span>ºC</span></h2>
<p>Cloudy weather in Moscow.</p>
</div>
<span class="cloudy"> </span>
</text>);
tabstrip.Add().Text("Sydney")
.Content(@<text>
<div class="weather">
<h2>17<span>ºC</span></h2>
<p>Rainy weather in Sidney.</p>
</div>
<span class="rainy"> </span>
</text>);
})
)