Question

我希望当你点击元素照片时，类任务列表淡入和淡出，我将在稍后添加更多动画，这就是为什么我想使用动画为它设置动画，当我尝试直接在照片上设置切换并跳过绑定时，它只是消失的照片元素，而不是用作任务列表的触发器。

有人知道如何在jquery mobile中使用切换功能吗？

$('#photo').bind("toggle", function(){
    $(".taskslist").animate({
        opacity: 1
    });
},
function(){
    $(".taskslist").animate({
        opacity: 0
    })
});

Answer 1

在vclick上使用animate函数回调来创建新动画。

$('#photo').on("vclick", function() {
    var IO = this.io ^= 1; // Toggle state 1,0,1,0...
    $(".taskslist").animate({opacity: IO ? 0 : 1}); // or inverse  1 : 0
});

Answer 2

根据OP的请求，这是允许多个动画的更新方法。切换基于目标元素的opacity。 Demo

$('#photo').click(function () {
    var tasklist = $('.tasklist');
    var visibility = tasklist.css("opacity");
    if (visibility == 1) {
        tasklist.animate({opacity: 0, left: 50});
    } else {
        tasklist.animate({opacity: 1, left: 0});
    };
});

这是使用jQuery＆＃39; fadeToggle的方法。看看here进行演示。

$('#photo').click(function () {
    $('.tasklist').fadeToggle("fast");
});

在jquerymobile中切换动画

2 个答案: