New to Telerik UI for ASP.NET Core? Download free 30-day trial

Razor Page

This article describes how to configure the Telerik UI Slider for ASP.NET Core in a RazorPages scenario.

See the Slider configuration in the example below, and for the full project with RazorPages examples, visit our GitHub repository.

@model Telerik.Examples.RazorPages.Pages.Slider.SliderIndexModel
    ViewData["Title"] = "SliderIndex";

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf


<h4>Horizontal orientation:</h4>
<div class="slider-container">
    .HtmlAttributes(new { @class = "balSlider", title = "slider" })
<h4>Vertical orientation:</h4>
<div class="slider-container">
    .HtmlAttributes(new { @class = "eqSlider", title = "eqSlider1" })

    .slider-container {
        padding-top: 20px;
        padding-bottom: 20px;
    div.balSlider {
        width: 100%;
    div.balSlider .k-slider-selection {
        display: none;
    div.eqSlider {
        display: inline-block;
        margin: 1em;
        height: 122px;
        vertical-align: top;
    public void OnGet()


See Also

In this article