当我使用事件处理程序时:
video.on("加载的元数据", function() {...})
调用回调时,Firefox 似乎没有正确设置视频尺寸。Chrome 运行良好。有没有办法在 Firefox 上正确获取视频尺寸?
编辑:如果我放置一个调试器并手动运行代码,它似乎可以工作。这让我相信这是某种竞赛条件。但这对我来说没有意义,因为正在调用该方法,这意味着事件应该已经正确发生=应该设置尺寸。
这是一个代码片段:
$("document").ready () ->
# Setup variables
video = $("#video")
toolbar = $("#toolbar")
canvas = $("#filter")
context = canvas.get(0).getContext('2d')
# Setup webcam
# I have a separate webcam module that simply wraps the behavior of
# navigator.getMediaStream. Works fine in chrome.
webcam.setup(() -> alert("Browser Unsupported."))
webcam.getMedia({video:true}, (localMediaStream) ->
video.attr("src", window.URL.createObjectURL(localMediaStream))
# Video loaded event
video.on "loadedmetadata", (e) ->
# Turn on video controls
video.prop("controls", true)
# Setup canvas dimensions and add border
width = video.width()
height = video.height()
canvas
.css("border", "solid")
.css("border-width", "1px")
.attr("width", width)
.attr("height", height)
# In firefox, the width and height are 0! In chrome, they
# are correct. I tested videoWidth/videoHeight and most other
# variables. Does not work.