如何将视频包含在具有巨大弹出窗口的图像库中?

时间:2018-07-28 15:04:19

标签: javascript php jquery

我尝试创建一个图片库,当我们单击图片时可以在其中添加视频。要清楚,图像是缩略图,但是当我们单击该缩略图时,应该会显示视频。

Tk

第1部分:

line.matches("[CLRQ]?\\s");

第2部分:javascript 用于图像的gallery.js

       $Qproducts = $Db->get('products', ['products_id', 'products_image', 'products_image_zoom', 'products_image_medium'], ['products_id' => $id, 'products_status' => 1]);

        $products_small_image = $Qproducts->value('products_image');
        $products_image_zoom = $Qproducts->value('products_image_zoom');
        $products_image_medium = $Qproducts->value('products_image_medium');
        $products_name = $Qproducts->value('products_name');

        $head = '<!--magnificPopup start  -->' . "\n";
        $head .= '<link rel="stylesheet" type="text/css" media="all" href="' . $template->getTemplateDefaultJavaScript('magnific/magnific-popup.css') . '">' . "\n";
        $head .= '<!--magnificPopup  end  -->' . "\n";

==> display information between <head></head>
        $template->addBlock($head, 'header_tags');

        $footer_tag = '<!-- magnificPopup start  -->' . "\n";
        $footer_tag .= '<script src="' . $template->getTemplateDefaultJavaScript('magnific/jquery.magnific-popup.min.js') . '"></script>' . "\n";
        $footer_tag .= '<script src="' . $template->getTemplateDefaultJavaScript('magnific/ClicShopping/gallery.js') . '"></script>' . "\n";
==> display information in the footer
        $footer_tag .= '<!--magnificPopup  end  -->' . "\n";

        $CLICSHOPPING_Template->addBlock($footer_tag, 'footer_scripts');


==> selec the video
    public function getVideo($video) {
        $item = ['youtube', 'vimeo', 'dailymotion'];

        foreach ($item as $result) {
            if (stripos($video, $result) !== false) {
                return true;
            }
        }
        return false;
    }

youtube.js.php

我那里有问题,按钮必须按我认为的图像进行更改? js不好!

$(document).ready(function() {
  $('.thumbnails').magnificPopup({
    type:'image',
    delegate: 'a',
    gallery: {
      enabled:true
    }
  });
});

第3部分 现在画廊 使用图像可以正常工作,但是如何使视频带有视频缩略图?

$('.button_<?php echo $pi_counter; ?>').magnificPopup({
  items: {
    src: <?php echo $video; ?>
  },
  type: 'iframe',
  iframe: {
    markup: '<div class="mfp-iframe-scaler">'+
    '<div class="mfp-close"></div>'+
    '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>'+
    '</div>',
    patterns: {
      youtube: {
        index: 'youtube.com/',
        id: 'v=',
        src: '//www.youtube.com/embed/%id%?autoplay=1'
      }
    },
    srcAction: 'iframe_src',
  }
});

0 个答案:

没有答案