OpenTok WebRTC样式问题

Question

我们正在构建一个带有PhoneGap的iOS (iPad)应用& OpenTok phonegap插件。然而，我们在样式方面有一个问题。实际的视频内容不会覆盖通过opentok框架创建的对象元素的整个宽度。我们正在向opentok传递关于视频的显式大小参数，但我们仍然存在这个问题。

任何帮助都将不胜感激！

Answer 1

下面是我的javascript代码(用coffeescript编写)：

session = ""
publisher = ""

subscribeToStreams = (streams)->
  for e in streams
    if (e.connection.connectionId == session.connection.connectionId)
      return
    div = document.createElement('div')
    div.setAttribute('id', 'stream' + e.streamId)
    div.setAttribute('class', "streamElement")
    document.body.appendChild( div )
    session.subscribe(e, div.id, {width: 640, height:480})

window.OTGroupChat = (apiKey, sessionId, token) ->
  publisher = TB.initPublisher(apiKey, "myPublisherDiv", {width: 320, height: 240})

  session = TB.initSession(sessionId)
  session.addEventListener 'sessionConnected', (event) ->
    session.publish( publisher )
    subscribeToStreams( event.streams )

  session.addEventListener 'streamCreated', (event) ->
    subscribeToStreams( event.streams )

  session.connect( apiKey, token )

结果: publisher视图按照预期显示为320x240，而订阅的streams显示为指定的640x480。

然后，我通过直接在控制台中输入来更改订阅流的高度：

$("object:last").height(100);
TB.updateViews();

订户流顺从地将大小调整到了新的高度。

当我给对象元素一个大小为1的粉色边框时，视频周围有一个1px的粉红色轮廓，这表明对象元素的大小肯定与视频相同。

​

​