Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
jQuery slider in asp net
Play lesson

jQuery tutorial for beginners - jQuery slider in asp net

5.0 (2)
25 learners

What you'll learn

This course includes

  • 22.5 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/06/jquery-slider-in-aspnet.html Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help. https://www.youtube.com/channel/UC7sEwIXM_YfAMyonQCrGfWA/?sub_confirmation=1 In this video we will discuss using jQuery slider widget in an asp.net web forms application. We want to increase and decrease the font-size using the slider 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 Options min - The minimum value of the slider. The default is 0 max - The maximum value of the slider. The default is 100 orientation - Horizontal or vertical orientation of the slider Events start - Triggered when the user starts sliding stop - Triggered when the user stops sliding slide - Triggered on every mouse move during slide The following example handles start, stop and slide events of the slider widget 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); } }); });

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere