jQuery slider in asp.net

HTML
<div id="slider"></div>
<br />
<div id="myDiv" style="font-size: 20px">
    Slider Example
</div>
 
jQuery code
$(document).ready(function () {
    var divElement = $('#myDiv');
    $('#slider').slider({
        min: 20,
        max: 120,
        orientation: 'horizontal',
        slide: function (event, ui) {
            divElement.css('font-size', ui.value + 'px');
        }
    });
});
 
For the complete list of slider options and events
http://api.jqueryui.com/slider

HTML
<div id="slider"></div>
<br />
<div id="divStart"></div>
<div id="divStop"></div>
<div id="divSlide"></div>
 
jQuery Code
$(document).ready(function () {
    $('#slider').slider({
        min: 20,
        max: 120,
        orientation: 'horizontal',
        start: function (event, ui) {
            $('#divStart').html('Start = ' + ui.value);
        },
        stop: function (event, ui) {
            $('#divStop').html('Stop = ' + ui.value);
        },
        slide: function (event, ui) {
            $('#divSlide').html('Slide = ' + ui.value);
        }
    });
});

Comments

Popular posts from this blog

jQuery dynamic menu from database in asp.net

Drag and Drop multiple File upload using jQuery AJAX in ASP.Net using C# and VB.Net

Automatically send Birthday email using C#.Net