2013-06-28 2 views
0

Не обвиняйте меня в этом вопросе, я действительно новичок в jquery!Как повторить преобразование поворота при щелчке мыши?

У меня есть изображение (значок гамбургера для навигационного меню) и хотелось бы повторить поворот, когда я нажимаю изображение.

$(document).ready(function(){ 
$('#nav-toggle').click(function(){ 
    $(this).css({ 
     "-webkit-transform": "rotate(90deg)", 
     "-moz-transform": "rotate(90deg)", 
     "transform": "rotate(90deg)" 
    }); 
}); 
+0

Ok. Что за вопрос? –

ответ

0

, если вы хотите "# нав-Toogle" вращать "90deg" за каждый клик вы можете сделать

$('#nav-toggle').click(function(){ 
    if($(this).data("deg")){ 
     $(this).data("deg",$(this).data("deg")+90); 
    } 
    else{ 
     $(this).data("deg",90); 
    } 
    $(this).css({ 
     "-webkit-transform": "rotate("+$(this).data("deg")+"deg)", 
     "-moz-transform": "rotate("+$(this).data("deg")+"deg)", 
     "transform": "rotate("+$(this).data("deg")+"deg)" 
    }); 
});  

http://jsfiddle.net/QrKrX/

+0

Поняли, спасибо! – andalusi

0

Возьмите свою автономную функцию и разломите ее. Таким образом, вы можете назвать все, что хотите.

$(document).ready(function(){ 
$('#nav-toggle').click(function(){ 
    transform($(this)); 
}); 

$('<item>').onMouseClick(function(){ 
    transform($(this)); 
}); 

function transform(var nav){ 
    nav.css({ 
     "-webkit-transform": "rotate(90deg)", 
     "-moz-transform": "rotate(90deg)", 
     "transform": "rotate(90deg)" 
    } 
+0

Благодарим вас за ответ. – andalusi