jQuery UI droppable - 它是如何工作的？

我創建了一個小頁面，並注意到一些有趣的行爲。jQuery UI droppable - 它是如何工作的？

當我將可拖動元素拖放到可放置區域時，該元素將位於徽標的右側，而不是位於其下方。

這是奇怪的，因爲標題和droppable是兩個不同的類。

enter image description here

這怎麼可能？謝謝。

編輯：CSS。

header { 
    width: 100%; 
    height: 5%; 

    background-color: gray; 

    position: relative; 

    z-index: 1; 
} 

header .logo { 
    width: 100px; 
    height: 150px; 

    background-color: white; 

    float: left; 

    margin-left: 50px; 

    position: relative; 

    z-index: 1; 
} 

.droppable { 
    width: 80%; 
    height: 50%; 

    background-color: red; 

    float: right; 

    margin: 2.5%; 

    position: relative; 

    z-index: 0; 
} 

.draggable { 
    width: 10%; 
    height: 15%; 

    float: left; 

    margin: 5%; 
}

的HTML（在拖拽元素被jQuery的動態添加）

<header> 
    <div class="logo"></div> 
</header> 
    <div class="droppable"> 
</div>

來源

2013-07-16 Stefan Moraru

請顯示您正在查詢的元素的CSS和HTML。 – DevlshOne

我添加了HTML和CSS。 –

和可拖動？對我來說，它看起來像可拖動的浮動在徽標上。它也似乎是可拖動的有一個非常大的邊界。展示你的所有工作將帶來更多的洞察力。 – DevlshOne

看來，你的CSS問題。我建議您查看並操縱logo周圍的浮標，以及draggables周圍的邊距或邊界。

來源

2013-07-17 10:52:20 DevlshOne

jQuery UI droppable - 它是如何工作的？

回答

相關問題