如何讓拖動影響另一個元素下的元素

我正在製作一個類似於Google地圖的地圖系統，並在右上角有一個迷你地圖視圖。問題是，有時候，即使當我在迷你地圖上開始拖動時，它也會以我想要的方式拖動底部位。有沒有辦法讓這個事件通過mini地圖div？提前致謝！如何讓拖動影響另一個元素下的元素

Mini map display

編輯：這裏是我的代碼

 $('.Container').draggable({ 
       containment: "parent", 

       drag: function(event, ui) { 
        var newLeft = (parseInt($('.Container').css('left'), 10)/-5)+80; 
        var newTop = (parseInt($('.Container').css('top'), 10)/-5)+80;            
        $('.mini-viewport').css({'top': newTop, 'left': newLeft});          

      } 

     });

而我的HTML結構： http://jsfiddle.net/thaiscorpion/XCCYe/

：

<div class="Viewport"> 

    <div class="mini-map"> 
     <div class="mini-viewport"></div> 
    </div> 

    <div class="Constrainer">  
     <div class="Container"></div> 
    </div> 

</div>

下面是一個什麼樣的jsfiddle我工作

來源

2012-11-10 Thaiscorpion

它始終是一個好主意，包括在這個問題你的代碼。 –

是的，你是對的謝謝。 – Thaiscorpion

我不太瞭解.draggable的工作方式，但我假設您希望將mousedown函數綁定到啓動容器可拖動函數的迷你視口。 – VIDesignz

這可能有用...我沒有辦法但它。

$('.mini-map').on('mousedown', function (e){ 
    e.preventDefault(); 
    $('.container').mousedown(); 
});

你也可以嘗試這個沒有的preventDefault ...

$('.mini-map').on('mousedown', function(){ 
    $('.container').mousedown(); 
});

來源

2012-11-10 08:20:21 VIDesignz

VIDesignz感謝您的幫助，但這不起作用，它只是使迷你地圖上沒有鼠標事件工作，但不讓它通過。 – Thaiscorpion

@Thaiscorpion你可以設置一個小提琴嗎？ http://jsfiddle.net – VIDesignz

現在要做：D – Thaiscorpion

歐凱我已經找到了一個解決方案，我最想不到的時候：d

如果我增加了微型在css中的地圖：

pointer-events:none;

它使所有輸入都通過該元素傳遞給下面的任何元素，工作grea牛逼！不要認爲IE支持這個壽我仍然要檢查，所以如果有人知道一個跨瀏覽器的方式讓我知道。

下面是有關指針事件的一些信息：
https://developer.mozilla.org/es/docs/CSS/pointer-events

來源

2012-11-10 17:33:36 Thaiscorpion

超棒的男人！幹得不錯！ – VIDesignz

它也適用於IE（11） – AllisonC

如何讓拖動影響另一個元素下的元素

回答

相關問題