向下拖動鼠標以顯示面板？（使用MooTools）

我有一個簡單的DIV面板，當用戶單擊並拖動一個較小的選項卡時，我想滑入該面板。有很多教程用於顯示點擊和滑動元素等，但這需要用戶點擊一下按鈕來顯示面板。向下拖動鼠標以顯示面板？（使用MooTools）

2011-02-17 Jared

但是，如果它需要用戶點擊並拖動，是不是你想要的？ – sdleihssirhc 2011-02-17 06:27:53

您需要在釋放鼠標按鈕後繼續移動元素，換句話說：慣性效果，不是嗎？ – kirilloid 2011-02-17 06:38:52

當用戶點擊並拖動一個按鈕時，面板會自行顯示。它會根據光標的y位置顯示x個像素。慣性？我承認是的。編輯，我明白你的意思是sdleihssirhc。我的意思是他們要求用戶只需點擊一次該元素即可顯示。 – Jared 2011-02-17 07:51:37

據我瞭解，你需要這樣的事：http://jsfiddle.net/steweb/pvdXa/

我做的這個最小模擬式..

標記：

<div id="handler"></div> <!-- your 'tab' to drag --> 
<div id="toSlide">content to be revealed</div> <!-- content to slide in/out -->

JS：

var toSlide = document.id('toSlide'); //get the content div 
document.id('handler').makeDraggable({ 
    limit:{x:[10,10],y:[10]}, //setting limits 
    onDrag:function(elem){ //while user drags, set the content height 
     toSlide.setStyle('height',elem.offsetTop-10); 
    } 
});

希望它有幫助:)

來源

2011-02-17 08:38:21 stecb

爲了可用性，我會添加點擊和拖動。我不會提供代碼，如果你想這樣做是複雜的插件「正確」;）

Drag有onCancel事件，在這裏你可以檢查用戶是否實際開始拖動或者只是單擊或長按可拖動元素。

對於拖動，您可以a）設置一個限制，因此用戶不會完全打開該元素，或者b）在打開x像素的滑塊後停止拖動，並用動畫滑動其餘部分。這樣，它就像您從手機中瞭解的觸摸滑塊，初始的短觸摸幻燈片啓動打開下拉菜單/導航。

來源

2011-02-17 08:54:39 digitarald

向下拖動鼠標以顯示面板？ （使用MooTools）

回答

相關問題

向下拖動鼠標以顯示面板？（使用MooTools）