jQuery Mobile不透明性不起作用:(

Question

如何使此按鈕在jQuery mobile上跳動？

jQuery mobile是否存在問題，因為在某些div上的主應用程序中，我可以應用這種脈動效果，而在其他應用程序上，它們只是閃爍，隨着中斷而淡入或淡出，或者生澀地淡入淡出。

HTML：

<button id="pulsate">I want to pulsate!</button>

JS：

    $('#pulsate').on('click', function () {
        pulsate("#pulsate");
    });


function pulsate(element) { 
    $(element || this).animate({ opacity: 0 }, 500, function() { 
       $(this).animate({ opacity: 1 }, 500, pulsate); }); 
} 

http://jsfiddle.net/alecstheone/zCUSK/

我只使用jquery和jquerymobile ...我注意到，如果我在jsfiddle中禁用jquerymobile，它可以工作，但是我不希望這樣做，因為我在應用程序中將jquerymobile用於其他用途...

Answer 1

您的代碼可以正常工作，但是您需要對腳本進行一些更改，因為您在按鈕上具有click事件，但是使用jQuery mobile時，您的按鈕卻用span和divs包裹了（主要是因為jquery mobile css），

因此，您只需要使用.closest()遍歷該目標div即可設置動畫效果。
以下是具有所需效果的代碼小演示。

$('#pulsate').on('click', function () {
    pulsate(this); // Change here
});

function pulsate(element) {
    $(element || this).closest("div.ui-btn").animate({
        opacity: 0
    }, 500, function () {
        $(this).closest("div.ui-btn").animate({
            opacity: 1
        }, 500, pulsate);
    });
}

小提琴的例子