Нужно вращать взад и вперед несколько раз при наведении JQuery - PullRequest
Новая
       22

Нужно вращать взад и вперед несколько раз при наведении JQuery

0 голосов
/ 01 марта 2012

Использование jQuery rotate http://code.google.com/p/jqueryrotate/wiki/Examples для анимации объекта от 0 до 40 градусов

Работает нормально при наведении курсора мыши, но при этом требуется автоматическое зацикливание анимации между двумя точками до тех пор, пока она наведена

Нужно закончить к обеду для клиента ... ПОМОГИТЕ! 

    jQuery("#leafmealonepoint").rotate({ 
     bind: 
 { 
    mouseover : function() { 
        jQuery(this).rotate({animateTo:40})
    },
    mouseover : function() { 
        jQuery(this).rotate({animateTo:0})
    }
         }

UPDATE

Хорошо, я пытаюсь использовать setInterval вот так - чего не хватает? 

    function move(){
       jQuery('#leafmealonepoint').rotate({animateTo:40}, function(){
       jQuery(this).rotate({animateTo:0});
       });
     }    

    jQuery('#leafmealone').hover(
        function() {
      hoverInterval = setInterval(move, 1000);
        },
      function(){
    clearInterval(hoverInterval);
    }
    );

ДОПОЛНИТЕЛЬНОЕ ОБНОВЛЕНИЕ 

     jQuery(function(){
         var leafmealone
         jQuery('#leafmealone').mouseenter(function(){
             leafmealone = setInterval(function()
             {jQuery('#leafmealonepoint').rotate({animateTo:40},
     jQuery('#leafmealonepoint').rotate({animateTo:0}))}, 1000);
         }).mouseleave(function(){clearInterval(leafmealone);
         });
     });

Чего мне не хватает?

Ответы [ 3 ]

1 голос
/ 01 марта 2012

попробуйте выполнить: 

jQuery(function(){
    var leafmealone
    jQuery('#leafmealone')
    .mouseenter(function(){
        leafmealone = setInterval(function() {
            jQuery('#leafmealonepoint')
            .rotate({animateTo:40})
            .rotate({animateTo:0});
        }, 1000);
    })
    .mouseleave(function(){
        clearInterval(leafmealone);
    });
});

Я не знаком с методом поворота, но обычно анимация выполняется / связывается.

1 голос
/ 01 марта 2012

Если вы хотите повторить, что анимация во время наведения мыши на этом элементе, вам нужна setInterval(), или анимация будет выполнена один раз и остановится после завершения, затем нажатие мыши снова будет выполнено и снова остановится.1003 * edit: Также у вас есть 2 события при наведении мыши, я думаю, что это опечатка, когда вам нужно навести курсор мыши, или используйте hover() напрямую.

0 голосов
/ 05 марта 2012

Вот решение 

 function leafmealone() {
        jQuery('#leafmealonepoint').stop().rotate({ angle:0, animateTo: 40, duration:600, callback: function() {
            jQuery('#leafmealonepoint').stop().rotate({ animateTo: 0, duration:600});
            }
        });
}

    jQuery(function() {
    jQuery('#leafmealone').hover(function(){
leafmealone();
hoverInterval = setInterval(leafmealone, 1200);
    }, function(){
      clearInterval(hoverInterval);
    });
   })

...