Draggable div背景在div1時是一種顏色，在div2時是另一種顏色

Question

我有一個可拖動的div，它最初定位在藍色標題上，所以白色背景有藍色文本和白色邊框，因此很突出。 當它被拖動到有白色背景的頁面的其餘部分時，我希望背景變成藍色，文本白色和邊框藍色。

可拖動div使用絕對定位，因此實際放置在標題元素之外，因此它需要檢測它所在頁面的哪個區域。

這可以使用CSS或Javascript/jQuery來完成嗎？

Answer 1

在JQuery中，我想你可以捕獲mouseOver事件（https://api.jquery.com/mouseover/），當它被觸發時，你會看到一些檢查是否有同時發生的拖動，如果發生，改變元素的顏色， mouseOver事件發生。

的代碼重要部分：

HTML：

<div draggable="true" class="bar">Drag me!</div>  

<div id="foo"><p>To be dragged over.</div>  

JQuery的：在鼠標懸停查看另一元件被拖動的時刻：

$('#foo').mouseover(function() { 
    if ($('.bar').is('.ui-draggable-dragging')) { return; // change color in here. } 

}）;

注意：你必須有這個附加id，至少我無法想象你是如何應用顏色變化正確的元素。儘管如此，顏色變化可以是一個功能，並且可以包含元素。