Форум

dany994 · #1 (**permalink**) 10.01.2017, 20:42

Добрый вечер! Помогите найти в чем проблема.
Вот скрипт: http://jsfiddle.net/8xwqdk71/?utm_source=website&utm_medium=embed&utm_campaign= 8xwqdk71
сдесь все работает. Этот же код не работает на локале.

Вот код с файла на локалке:

<style>
#image{
  margin:100px 100px;
}
</style>

<img src="https://www.google.com/images/srpr/logo3w.png" id="image">

<script type="text/javascript">
var value = 0
$("#image").rotate({ 
   bind: 
     { 
        click: function(){
            value +=90;
            $(this).rotate({ animateTo:value})
        }
     } 
   
});
</script>
<script src="http://beneposto.pl/jqueryrotate/js/jQueryRotateCompressed.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

В чем может быть проблема? Спасибо!

рони · #2 (**permalink**) 10.01.2017, 21:40

dany994,
где jquery?

строка 6 jquery потом плагины из 22, 23

dany994 · #3 (**permalink**) 11.01.2017, 09:30

Сообщение от рони

dany994,
где jquery?

строка 6 jquery потом плагины из 22, 23

Спасибо большое, работает!
Подскажите еще если не трудно, как сделать что бы скрипт работал на всех картинках с id="image"... Сейчас работает только на первой картинки. Спасибо.

рони · #4 (**permalink**) 11.01.2017, 09:43

dany994,
заменить id на class в картинках, и # на . в скрипте

рони · #5 (**permalink**) 11.01.2017, 09:54

dany994,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style>
.image{
  margin:100px 100px;
}
</style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="http://beneposto.pl/jqueryrotate/js/jQueryRotateCompressed.js"></script>
  <script>
$(function() {
    $(".image").each(function(indx, el) {
        var value = 0;
        $(el).on({
            click: function() {
                value += 90;
                $(el).rotate({
                    animateTo: value
                })
            }
        })
    })
});
  </script>
</head>

<body>
<img src="https://www.google.com/images/srpr/logo3w.png" class="image">
<img src="https://www.google.com/images/srpr/logo3w.png" class="image">
<img src="https://www.google.com/images/srpr/logo3w.png" class="image">
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript