点击旋转图片，jQuery

Question

我尝试设置单击链接后旋转的图像。 共有3个链接。 如果单击第二个链接，图像将旋转20度。 如果在第二个链接之后单击了第三个链接，则图像旋转了+20度。 如果单击第一个链接，图像将旋转回到默认位置。
概念简化：
link1 =图片默认位置
link2 =图像旋转20度
link3 = +另外20度
如果从链接3单击到链接2 -20度。

网站使用fullpage.js 。 旋转图像是指导航点（请参阅此处 ）。 如果使用鼠标滚动，我不希望图像旋转，这远远超出了我的范围...

作为基础，我正在使用jQuery旋转插件示例5

var value = 0
$("#img").rotate({ 
   bind: 
     { 
        click: function(){
            value +=90;
            $(this).rotate({ animateTo:value})
        }
     } 

});

到目前为止， jsfiddle ...我什至不知道如何分配链接，以便在单击图像时旋转。

非常感谢您的帮助。 我不希望别人做任何事情，至少可以指导我。

Answer 1

您可以将click事件绑定到li 。 每次单击li ，请检查其文本。 然后基于此旋转您的图像

尝试：

var value = 0;
$( "li" ).click(function() {
    var text=$(this).text();
    if(text==="Link1"){value=0;}
    if(text==="Link2"){value+=20;}
    if(text==="Link3"){value-=20;}
    $("#image").rotate({ animateTo:value});

});

DEMO