Поворот изображения Jquery с помощью ручки слайдера
Привет, у меня есть круглый ползунок круга, в котором может быть добавлено несколько изображений, но я добавил Одно изображение, и я хочу повернуть изображение, когда кто-то перемещает ползунок вот ссылка
Демонстрация Слайдера
Слайдер JQuery Файл
Крошечный Ползунок Круга
Я хочу, чтобы, когда кто-то перетаскивает слайдер с ручкой слайдера pic movie влево, он должен вращаться в соответствии с ручкой слайдера.
<script type="text/javascript"> jQuery(document).ready(function($) { $('#rotatescroll').tinycircleslider(); }); </script>
#rotatescroll { height:300px; position:relative; width:300px; } #rotatescroll .viewport{ height:300px; position: relative; margin:0 auto; overflow:hidden; width:300px; pointer-events: none } #rotatescroll .overview { position: absolute; width: 798px; list-style: none; margin: 0; padding: 0; left: 0; top: 0; } #rotatescroll .overview li { height:300px; width:300px; float: left; position: relative; } #rotatescroll .overlay {background:url(http://www.impacticondemos.website/westpoint/wp-content/uploads/2016/11/scrollbg4.png) no-repeat 0 0; pointer-events: none; position: absolute; left: 0; top: 0; height:300px; width:300px; } #rotatescroll .thumb { background:url(http://www.impacticondemos.website/westpoint/wp-content/uploads/2016/11/thumb2.png) no-repeat 50% 50%; touch-action: none; -ms-touch-action: none; position: absolute; top: -3px; cursor: pointer; left: 137px; width: 100px; z-index: 200; height: 100px; } #rotatescroll .dot span { display: none; }
Что я уже пробовал:
Я попытался изменить левый элемент на Javascript-коде и поставить transform degree, но он не работает, я больше разработчик PHP, а не Jquery, пожалуйста, помогите мне, ребята.