閃爍着綠色.drop div當拖動.drag時

我想在拖動.drag時閃爍.drop div。閃爍着綠色.drop div當拖動.drag時

而當.drag格局被擱置或恢復時，我希望.drop格停止閃爍。

但我想用顏色眨眼，例如用綠色，但我沒有看到如何用fadeTo（）。

你知道如何解決我的代碼來實現這個嗎？

這裏舉例：

代碼：

$(".drag").draggable({ 
    revert: 'invalid', 
    drag: function(event, ui) { 
    $('.drop').fadeTo('fast',0).fadeTo('fast',1); 
    } 
}); 

$('.drop').droppable({ 
    over: function(event, ui) { 
    $('.drop').fadeTo('fast',0).fadeTo('fast',0); 
    ui.draggable.remove(); 
    } 
});

來源

2015-12-02 ProjecT

您是否希望每眨眼一次，或每次閃爍綠色？ – Druzion

你可以嘗試改變div的背景顏色，當.drag拾取

$(".drag").draggable({ 
    revert: 'invalid', 
    drag: function(event, ui) { 
    $('.drop').fadeTo('fast',0) 
    $('.drop').css('background-color', 'green') 
    $('.drop').fadeTo('fast',1); 
    } 

});

JSFiddle

來源

2015-12-02 20:10:00 Druzion

謝謝，但是你知道嗎，在.drag div被刪除之後，或者.drag div被恢復到原始位置時，如何停止閃爍？ – ProjecT

不，我不能。我已經制定了如何使「背景顏色」變回，但不是閃爍。 – Druzion

我可以說的一件事是，div不停地閃爍，它只需要一分鐘左右。看起來，每次鼠標移動時代碼都會執行，因此在屏幕上移動代碼可能會導致執行數百次。你可能能夠使用'start'和'stop'事件而不是'drag'事件，在開始時將變量設置爲'true'，在停止處設置'false'。然後，您只需要一個循環來定期檢查變量是否爲「true」並執行代碼。 – Druzion

此代碼可以解決您的問題。

<div id="cuadrado" class="drop" style="background:gray; margin-top:50px; width:100px; height:100px;"> drop</div> 

<script> 
$('.drop').droppable({ 

    over: function(event, ui) { 
    document.getElementById("cuadrado").style.color="green"; 
    document.getElementById("cuadrado").style.background="green"; 
    $('.drop').fadeTo('fast',0).fadeTo('fast',0); 
    ui.draggable.remove(); 

    } 
}); 
</script>

enter image description here

運行下面的代碼獲得：

enter image description here

我希望它可以幫助你。

bye @locoalien

來源

2015-12-02 20:13:53 locoalien

閃爍着綠色.drop div當拖動.drag時

回答

相關問題