Member 12872798 Ответов: 0

Поворот изображения 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, пожалуйста, помогите мне, ребята.

0 Ответов