我尝试创建一个图片库,当我们单击图片时可以在其中添加视频。要清楚,图像是缩略图,但是当我们单击该缩略图时,应该会显示视频。
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',
}
});