0

ビデオのサムネイル (画像) があるページがあり、クリックするとビデオが大きな div で再生されます。ホバーオーバーなどでスタイルを設定していますが、ビデオの再生中に現在のサムネイルをスタイルして、再生中のサムネイルがわかるようにしたいと思います。

アクティブなクラスをサムネイル div に追加しようとしましたが、クラスのスタイルはそれらすべてに適用されます。誰でもこれを達成する方法やどこが間違っているのか理解できますか?

htmlコード

<div class="main">
<iframe width="800" height="500" src="video-1.mp4" frameborder="0" allowfullscreen></iframe>
</div>

<ul>
<li class="thumbnail"><a href="video-1.mp4" class="video-1" title=""><img src="images/videoPlayer-thumbnail-1.jpg" alt=""/></a></li>
<li class="thumbnail"><a href="video-2.mp4" class="video-2" title=""><img src="images/videoPlayer-thumbnail-2.jpg" alt=""/></a></li>
<li class="thumbnail"><a href="video-3.mp4" class="video-3" title=""><img src="images/videoPlayer-thumbnail-3.jpg" alt=""/></a></li>
</ul>
4

1 に答える 1

0

ページが更新されない場合は、クリックした IMG に CLASS を追加して、スタイルを好きなように変更できます。

編集：

<li class="thumbnail">
  <a href="video-3.mp4?class=link1" class="video-3" title="">
     <img src="images/videoPlayer-thumbnail-3.jpg" alt=""/>
  </a>
</li>

そして、jQuery を使用して URL を分割し、パラメーターを見つけてから、css パスと一致させます。

于 2013-05-20T10:02:40.807 に答える