CSS或JavaScript點擊保持功能

我使用jQuery可拖動，我想要做的是當我點擊並按住標題，光標變成移動光標。我已經嘗試過css活躍和焦點，但沒有發生。CSS或JavaScript點擊保持功能

2010-09-26 vb mozilla

對於純CSS的方法，你可能會發現，CSS :active僞選擇/僞元素是去使用div:active的方式，演示：jsbin

如果做不到這一點，不過，你還不如用jQuery來添加一個選擇（我不太清楚.click()是否需要鼠標按鈕被按下和發佈，所以我建議在jQuery的方法mousedown()

$('#divIDOrClass').mouseup(
function() { 
    $(this).removeClass('active'); 
}).mousedown(
function() { 
    $(this).addClass('active') 
});

演示：jsbin。

順便提及，之所以說:focus沒有/不工作，是因爲:focus通常適用於那些具有鍵盤或其他輸入，聚焦元件。這通常是對於形式的輸入元件和超連接（因爲超鏈接可以通過標籤，訪問密鑰和輸入接收鍵盤活化標準）。

來源

2010-09-26 15:43:20

在Chrome中無法使用或不使用拖動功能。問題似乎是一旦發生點擊事件就無法更改光標。 – Robert 2010-09-26 16:12:37

jsbin演示程序都可以在我的Ubuntu 10.04版本的Chrome（6.0.472.63）上運行。你正在使用哪個版本？話雖如此，不，光標更改不會發生。那是唯一不適合你的嗎？ – 2010-09-26 16:14:40

6.0.472.63在XP上。詳細說明，我得到的只是光標變化。 – Robert 2010-09-26 16:15:50

您是否嘗試了可拖動部分的內置光標功能？

//The css cursor during the drag operation. 

//Code examples 

//Initialize a draggable with the cursor option specified. 
$(".selector").draggable({ cursor: 'crosshair' }); 
//Get or set the cursor option, after init. 
//getter 
var cursor = $(".selector").draggable("option", "cursor"); 
//setter 
$(".selector").draggable("option", "cursor", 'crosshair');

http://jqueryui.com/demos/draggable/#option-cursor

來源

2010-09-26 15:46:48 Robert

你可以定義你的光標的風格是這樣的：

$(function() { 
    $("#draggable").draggable({ cursorAt: { cursor: "move", top: 56, left: 56 } }); 
    $("#draggable2").draggable({ cursorAt: { cursor: "crosshair", top: -5, left: -5 } }); 
    $("#draggable3").draggable({ cursorAt: { bottom: 0 } }); 
});

來源

2010-09-26 15:48:16 Thomas

下面是一個「純CSS」另一項建議（不是真的，從這個意義上說，我們仍然在這裏使用jQuery UI）解決方案：請注意，類ui-draggable-dragging被添加到元素，每當元素正在被拖動。因此，簡單的事情如下：

.ui-draggable-dragging { 
    cursor: move; 
}

Should work。否則羅伯特的回答與cursor選項也應該這樣做。

來源

2010-09-27 03:32:56

CSS或JavaScript點擊保持功能

回答

相關問題