【问题标题】:Problems with drop down menus over playing HTML5 video播放 HTML5 视频时出现下拉菜单问题
【发布时间】:2012-02-23 21:11:43
【问题描述】:

在播放 HTML 5 视频时,我在获取下拉菜单 (jQuery) 时遇到了一些问题。当视频还没有开始播放时,比如第一次加载页面时,没关系。但是,一旦视频开始播放,甚至在暂停之后,视频上方的下拉菜单在 Safari 中开始变得混乱,而在 Chrome 中,文本根本不存在。在 Firefox 中,文本在播放视频时显示为应有的效果。

标头的代码位于 iframe 上方的 php 文件中,该 iframe 正在播放视频。所以标题向下延伸通过 iframe,同时保持在顶部。

这里有一些截图,看看我在说什么(Stack Overflow 不允许我直接发布图片,但这里有链接):

火狐

http://oi41.tinypic.com/qpm16a.jpg

如果你需要看代码,这里有一个链接到你可以查看源代码的页面:

http://filmlook.com/e_website/

(由于新手状态,我无法发布更多链接或图片,但您可以自行查看该网站以了解问题所在。)

显然,我希望代码大部分保持不变,但如果我可以使用另一个可以更好地工作的菜单系统或任何其他选项,我会听到一切。

另外,我也是一个代码菜鸟,所以请尽量解释你的答案。

谢谢

【问题讨论】:

  • 在我的 Firefox 和 chrome 中看起来不错。我有 IE8,菜单出现在视频后面。否则它看起来很好。
  • 嗯,好的。所以它在 Windows 上看起来不错,除了 IE8 问题。在 Mac 上使用 Chrome,文本会消失...
  • 我可以确认问题存在于 Mac Chrome 和 Safari 中。

标签: jquery css html5-video drop-down-menu


【解决方案1】:

如果我手动更改 css 属性“显示:无;”到“显示:块”;它甚至可以在带有覆盖层的 chrome 中使用。我看到你正在使用 effet 来显示你的下拉菜单。你试过没有那个吗?

所以只需更改您的显示器并检查它是否有效。

【讨论】:

  • 确认一下,你说的是#nav ul的显示属性吗?我将其更改为阻止,但是一旦页面加载,就会显示子菜单,而不是当您将鼠标悬停在它们上方时。从某种意义上说,这似乎确实有效,您可以通过正在播放的视频阅读文本,尽管我仍然不确定如何让一切工作 100%。您能否说明在 CSS 中更改显示的元素?
  • 我在谈论您的 ul 元素,它们位于您的主导航 (ul id="nav") 的 li 元素中。因为您正在使用效果来显示它们(例如 jquery onmouseover->fadein() ),所以我会尝试更改显示元素(例如 jquery show() 和 hide())。只是为了检查问题是否仍然存在......因为如果我在萤火虫中改变它,它就可以工作,所以可能是淡入/淡出的问题?!我更喜欢 mootools,但猜测它们具有相同的功能。
  • 所以每个 ul > li > ul 元素都有 display:none;和 mouseleave->hide() 上的 onmouseover->show() 尝试像这样检查是否修复了覆盖错误
  • 好的,所以我不确定这是否是您的意思,但是在 header.php 文件中,我将 slideDown 和 slideUp 的命令分别更改为显示和隐藏,并且成功了!感谢您的帮助。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-11-18
  • 1970-01-01
  • 2014-01-04
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多