0

我有一个脚本可以切换 div 的块/无显示，onClick。onClick 还将关联的“缩略图”图像从活动切换到非活动。

只有在 Firefox 中，div 的堆栈是相互叠加的。似乎 onClick 没有将 display:none 样式与当前项目相关联。

我确保所有 div 都有关联的 ID，这似乎是 Firefox 中与 getElementById 问题相关的首要问题。

有关故障排除的任何想法都会有所帮助，谢谢！

这是我的javascript：

var curVid = "VideoA";
var curImg = "VideoA_thumbnail";

function changeVideo(id, img)
  {
   if(document.getElementById(id) != null && curVid != id)
  {

    document.getElementById(curVid).style.display = "none";
    document.getElementById(id).style.display = "block";
    document.getElementById(id + "_thumb").src = "..//Thumbnails//" + img + "_selected.jpg";
    document.getElementById(id + "_thumb").style.cursor = "default";
    document.getElementById(curVid + "_thumb").src = "..//Thumbnails//" + curImg + ".jpg";
    document.getElementById(curVid + "_thumb").style.cursor = "pointer";

    if(VideoJS.browserSupportsVideo())
      {
        document.getElementById(curVid + "_video").pause();
        document.getElementById(curVid + "_video").currentTime = 0;
        VideoJS.setup(id + "_video");
        document.getElementById(id + "_video").play();
      }
    else
      {
        $f(curVid + "_flash").stop();
        $f(id + "_flash").play();
      }

curVid = id;
curImg = img;
}
}

这是HTML

<div id = "VideoA" style = "display:block;">content here</div> 
<div id = "VideoB" style = "display:none;">content here</div> 
<div id = "VideoC" style = "display:none;">content here</div> 
<div id = "VideoD" style = "display:none;">content here</div> 
<div id = "VideoE" style = "display:none;">content here</div> 



<div>
   <img src = "a.jpg" id = "VideoA_thumb" onclick = "changeVideo('VideoA', 'VideoA_thumb')" />
   <img src = "b.jpg" id = "VideoB_thumb" onclick = "changeVideo('VideoB', 'VideoB_thumb')" />
   <img src = "c.jpg" id = "VideoC_thumb" onclick = "changeVideo('VideoC', 'VideoC_thumb')" />
   <img src = "d.jpg" id = "VideoD_thumb" onclick = "changeVideo('VideoD', 'VideoD_thumb')" />
   <img src = "e.jpg" id = "VideoE_thumb" onclick = "changeVideo('VideoE', 'VideoE_thumb')" />
</div>
4

0 回答 0