From 28d5943404184b5a6b3892468520e1e2d0d04a20 Mon Sep 17 00:00:00 2001 From: Scholar Jaruha Date: Tue, 21 Nov 2023 09:42:15 +0300 Subject: [PATCH 1/3] SEO-177254-React-Range-Slider-External-Linking --- README.md | 47 +++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 39 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 1032d6c..cec82d0 100644 --- a/README.md +++ b/README.md @@ -1,15 +1,46 @@ # Getting Started with the React Range Slider Component -A quick start project that shows how to create and configure the Syncfusion React Range Slider component in a React project. This project contains the code for binding values, applying ranges, types, tooltips, ticks, formats, and limits. You will also find the code to customize the Range Slider using CSS class. - -Refer to the following documentation to learn about the React Range Slider component: -https://ej2.syncfusion.com/react/documentation/range-slider/getting-started - -Check out this online example of the React Range Slider component: -https://ej2.syncfusion.com/react/demos/#/material/range-slider/default +The [React Range Slider](https://www.syncfusion.com/react-components/react-slider?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) is an HTML5 input control that is used to select a value or range of values. Select a relative quantity value by moving a thumb along a bar. A quick start project that shows how to create and configure the Syncfusion React Range Slider component in a React project. This project contains the code for binding values, applying ranges, types, tooltips, ticks, formats, and limits. You will also find the code to customize the Range Slider using CSS class. ## Project prerequisites Make sure that you have the compatible versions of [Visual Studio Code](https://code.visualstudio.com/download ) and [NodeJS](https://nodejs.org/en/download) or later version in your machine before starting to work on this project. ## How to run this application -To run this application, you need to first clone the `getting-started-with-the-react-range-slider-component` repository and then open it in Visual Studio Code. Now, simply build and run your project to view the output. \ No newline at end of file +To run this application, you need to first clone the `getting-started-with-the-react-range-slider-component` repository and then open it in Visual Studio Code. Now, simply build and run your project to view the output. + +## Features and Benefits + +### Orientation +The Slider can be displayed, either in horizontal or vertical orientation. By default, the Slider renders in horizontal orientation. + +### Tooltip +The Slider displays the tooltip to indicate the current value by clicking the Slider bar or drag the Slider handle. + +### Buttons +The Slider value can be changed by using the Increase and Decrease buttons. In Range Slider, by default the first handle value will be changed while clicking the button. Change the handle focus and press the button to change the last focused handle value. + +## Related links +[Learn More about React Range Slider](https://www.syncfusion.com/react-components/react-slider?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Download Free Trial](https://www.syncfusion.com/downloads?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Pricing](https://www.syncfusion.com/sales/teamlicense?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Documentation](https://ej2.syncfusion.com/react/documentation/range-slider/getting-started?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[View Demos](https://github.com/SyncfusionExamples/getting-started-with-the-react-range-slider-component?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Community Forums](https://www.syncfusion.com/forums/react-js2?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Suggest a feature](https://www.syncfusion.com/feedback/react?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Online Examples](https://ej2.syncfusion.com/react/demos/#/bootstrap5/range-slider/default?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + +## About Syncfusion React Components + +Syncfusion's [React Components](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) library is the only suite that you will ever need to build an application since it contains over 80 high-performance, lightweight, modular, and responsive UI Components in a single package. In addition to Range Slider, we provide popular react Components such as [DataGrid](https://www.syncfusion.com/react-components/react-grid?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Charts](https://www.syncfusion.com/react-components/react-charts?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Scheduler](https://www.syncfusion.com/react-components/react-scheduler?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Diagram](https://www.syncfusion.com/react-components/react-diagram?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [Word Processor](https://www.syncfusion.com/react-components/react-word-processor?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + +## About Syncfusion +Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 29,000 customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies. + +Today, we provide 1800+ controls and frameworks for web ([Blazor](https://www.syncfusion.com/blazor-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET WebForms](https://www.syncfusion.com/jquery/aspnet-webforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [react](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [React](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Vue](https://www.syncfusion.com/vue-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)), mobile ([Xamarin](https://www.syncfusion.com/xamarin-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples),[Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)), and desktop development ([Windows Forms](https://www.syncfusion.com/winforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [WPF](https://www.syncfusion.com/wpf-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [WinUI](https://www.syncfusion.com/winui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software. + + +
+ +

+ sales@syncfusion.com | www.syncfusion.com | 1-888-9 DOTNET
+

\ No newline at end of file From a1f8c5863de46e94319af239b1da85b8fa195c17 Mon Sep 17 00:00:00 2001 From: Scholar Jaruha Date: Tue, 21 Nov 2023 11:07:57 +0300 Subject: [PATCH 2/3] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index cec82d0..9b4b360 100644 --- a/README.md +++ b/README.md @@ -21,7 +21,7 @@ The Slider value can be changed by using the Increase and Decrease buttons. In R ## Related links [Learn More about React Range Slider](https://www.syncfusion.com/react-components/react-slider?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) -[Download Free Trial](https://www.syncfusion.com/downloads?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) +[Download Free Trial](https://www.syncfusion.com/downloads/react?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) [Pricing](https://www.syncfusion.com/sales/teamlicense?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) [Documentation](https://ej2.syncfusion.com/react/documentation/range-slider/getting-started?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) [View Demos](https://github.com/SyncfusionExamples/getting-started-with-the-react-range-slider-component?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) From 0d9005f31b9de0bc78be250a61483041a20ad5ba Mon Sep 17 00:00:00 2001 From: Scholar Jaruha Date: Wed, 22 Nov 2023 11:30:50 +0300 Subject: [PATCH 3/3] Update README.md --- README.md | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 9b4b360..52b58e7 100644 --- a/README.md +++ b/README.md @@ -21,26 +21,33 @@ The Slider value can be changed by using the Increase and Decrease buttons. In R ## Related links [Learn More about React Range Slider](https://www.syncfusion.com/react-components/react-slider?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [Download Free Trial](https://www.syncfusion.com/downloads/react?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [Pricing](https://www.syncfusion.com/sales/teamlicense?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [Documentation](https://ej2.syncfusion.com/react/documentation/range-slider/getting-started?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [View Demos](https://github.com/SyncfusionExamples/getting-started-with-the-react-range-slider-component?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [Community Forums](https://www.syncfusion.com/forums/react-js2?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [Suggest a feature](https://www.syncfusion.com/feedback/react?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) + [Online Examples](https://ej2.syncfusion.com/react/demos/#/bootstrap5/range-slider/default?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) ## About Syncfusion React Components Syncfusion's [React Components](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) library is the only suite that you will ever need to build an application since it contains over 80 high-performance, lightweight, modular, and responsive UI Components in a single package. In addition to Range Slider, we provide popular react Components such as [DataGrid](https://www.syncfusion.com/react-components/react-grid?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Charts](https://www.syncfusion.com/react-components/react-charts?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Scheduler](https://www.syncfusion.com/react-components/react-scheduler?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Diagram](https://www.syncfusion.com/react-components/react-diagram?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [Word Processor](https://www.syncfusion.com/react-components/react-word-processor?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples) -## About Syncfusion +### About Syncfusion Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 29,000 customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies. -Today, we provide 1800+ controls and frameworks for web ([Blazor](https://www.syncfusion.com/blazor-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET WebForms](https://www.syncfusion.com/jquery/aspnet-webforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [react](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [React](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Vue](https://www.syncfusion.com/vue-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)), mobile ([Xamarin](https://www.syncfusion.com/xamarin-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples),[Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)), and desktop development ([Windows Forms](https://www.syncfusion.com/winforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [WPF](https://www.syncfusion.com/wpf-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [WinUI](https://www.syncfusion.com/winui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software. +Today, we provide 1800+ controls and frameworks for web ([Blazor](https://www.syncfusion.com/blazor-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [ASP.NET WebForms](https://www.syncfusion.com/jquery/aspnet-webforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Angular](https://www.syncfusion.com/angular-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [React](https://www.syncfusion.com/react-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [Vue](https://www.syncfusion.com/vue-components?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)), mobile ([Xamarin](https://www.syncfusion.com/xamarin-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples),[Flutter](https://www.syncfusion.com/flutter-widgets?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)), and desktop development ([Windows Forms](https://www.syncfusion.com/winforms-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [WPF](https://www.syncfusion.com/wpf-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [WinUI](https://www.syncfusion.com/winui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), [UWP](https://www.syncfusion.com/uwp-ui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples), and [.NET MAUI](https://www.syncfusion.com/maui-controls?utm_source=github&utm_medium=listing&utm_campaign=react-range-slider-github-samples)). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software.

- sales@syncfusion.com | www.syncfusion.com | 1-888-9 DOTNET
+ sales@syncfusion.com | www.syncfusion.com | 1-888-9 DOTNET

\ No newline at end of file