Build a Content Slider

This project should use a single HTML page, jQuery, and C# .NET for parsing of the [login to view URL] file. Create a slider on a HTML page which slides from right to left (see the slider image below). Use mCustomScrollbar() for the scroll bar. Add a select dropdown as seen on the image. The dropdown will have the following option as seen below in the addendum “Select” section. When the select dropdown is changed, the outer HTML content data-cat will be used to determine which images located in /content/assets/minimalist-basic/thumbnails show. Some elements have multiple items in their data-cat, and some have a single item (e.g. data-cat=”0,6”, data-cat=”1”). Each item in the data-cat correspond to a value in the select dropdown. A -1 in the select dropdown will show all icons within the slider. Do not use database sorting to group, instead, use client side sorting. When the user holds the mouse down over an icon in the slider, they can drag it unto an HTML content on the page. Use onmouseenter for the HTML content on the page. Basically, on page load, fire the onmouseenter event. An example would be var $mastercontent = $(‘body’).find(‘*).on(‘mouseenter’, function(){...}). Outline the area that the user is hovering over. So within the mouseenter function as shown above, add a css class using outline: 1px solid <some-color>. Within the mouseenter function, do a find on the body for the css class which adds the outline and remove the class. Do this before adding the class on the current element where the mouseenter has been triggered. When the mouse is released, the content within the out HTML will use jQuery .append statement to append the HTML into the mouseenter object. Do not append starting from the outer HTML content containing the data-num attribute. Add HTML and CSS to Shadow DOM. Use C# to load content in the HTML file located at /content/assets/minimalist-basic/[login to view URL] into a database. Use C# to write content from database table back into the HTML file and overwrite the HTML file Image files located in /content/assets/minimalist-basic/thumbnails should appear within the slider as shown in the image within the PDF document. The major portion of this project is located in the PDF document