1
Я пытаюсь обнаружить события старта/перетаскивания событий на элементе. Иногда эти события, похоже, не срабатывают. Источник находится на JSFiddle. Попробуйте удерживать мышь в оранжевой полосе и перетаскивать ее, чтобы создать интервалы (синим цветом). В Chrome попробуйте сделать это 3 раза. В третий раз, я замечаю почти всегда, событие mouseup не запускается, что делает эффект странным. Даже когда мышь не будет нажата, событие перетаскивания еще срабатываетСобытия мыши не запускаются после нескольких щелчков по элементу
$ ->
isMouseDown = false
isDragging = false
$draggedInterval = undefined
$test = $("#test")
$test
# code related to attaching handlers to trigger custom events
.on "mousedown", ->
isMouseDown = true
.on "mouseup", (evt) ->
isMouseDown = false
if isDragging
$test.trigger("x-stopDrag", evt)
isDragging = false
else
$test.trigger("x-click", evt)
.on "mousemove", (evt) ->
console.log isMouseDown, isDragging
if isMouseDown && not isDragging
$test.trigger("x-startDrag", evt)
isDragging = true
if isDragging
$test.trigger("x-drag", evt)
.on "mouseleave", (evt) ->
isMouseDown = false
if isDragging
isDragging = false
$test.trigger("x-cancelDrag", evt)
# handlers for custom events
.on "x-startDrag", (x, evt) ->
console.log("started dragging")
$draggedInterval = $("<div>", {
class: "interval"
css:
left: evt.clientX
}).appendTo($test)
.on "x-stopDrag", (x, evt) ->
console.log("stopped dragging")
$draggedInterval = undefined
.on "x-cancelDrag", ->
console.log("canceled dragging")
$draggedInterval.remove()
$draggedInterval = undefined
.on "x-click", (x, evt) ->
console.log("click")
.on "x-drag", (x, evt) ->
console.log("drag")
$draggedInterval.css("width", evt.clientX - $draggedInterval.position().left)
Появляется работать в Firefox и IE10
