image - Joomla K2 アイテム画像のホバー

Question

ハイ、

アイテムの画像にホバーする方法はありますか?ホバーはいつビデオを再生しますか?

このようなものですが、ポップアップにはありません: デモ

前もって感謝します

Answer 1

これはそのままでは不可能です。これは有料の拡張機能であると確信していますが、古き良き方法でコーディングしたい場合は、jQuery と HTML5 ビデオ プレーヤーを使用してこれを実現できます。

  <video id="video" width="420">
    <source src="mov_bbb.mp4" type="video/mp4">
    <source src="mov_bbb.ogg" type="video/ogg">
    Your browser does not support HTML5 video.
  </video>

  <a id="thumbnail">Im the thumbnail</a>

<script>

jQuery(document).ready(function($) {
   jQuery('#thumbnail').hover(function() {
     jQuery('#video').show(); 
       jQuery('#video').play(); 
   }, function() {
          jQuery('#video').hide(); 
       jQuery('#video').pause(); 
   });
 }); 

</script>

私が提案するのは、データ属性を介してビデオとサムネイルをリンクすることです。

例えば

<a id="thumbnail" data-video="#video"></a>

<script>
jQuery(document).ready(function($) {
   jQuery('#thumbnail').hover(function() {
     jQuery(jQuery(this).data('video')).show(); 
       jQuery(jQuery(this).data('video')).play(); 
   }, function() {
          jQuery(jQuery(this).data('video')).hide(); 
       jQuery(jQuery(this).data('video')).pause(); 
   });
 }); 

</script>

サムネイル上で、または複数のビデオの親コンテナに対して相対的にする。