gallery 相关问题

Gallery是软件系统中的照片集合

如何在手机版浏览网站时禁用Wordpress功能？

我有一个自定义图库短代码，因为我在我的图库页面中使用同位素。所以基本上，我有一页画廊，我只需将所有图像拖放到此处并放置同位素...

jquery wordpress gallery jquery-isotope

回答 2 投票 0

我正在尝试将这个正常代码隐藏为foreach：

我使用自定义元框创建了 WordPress 画廊，我的代码根据我的需要提供了正确的输出。但试图以标准方式做到这一点。原始代码 $mytheme_gallery_one = get_post_meta( get_the_I...

php wordpress gallery

回答 2 投票 0

Elementor：如何在最后停止wordpress gallery，不循环？

我希望我的画廊停在画廊最后一张照片的末尾。我必须为其添加任何 jQuery 吗？我已经从 elementor 小部件添加了这个画廊。请帮忙添加信息：点击后...

html jquery wordpress gallery elementor

回答 2 投票 0

使用 HTML CSS JavaScript 的画廊网站的多种模式

我正在为网站制作画廊，但模态对我不起作用。我尝试了一切。如果可能的话，请添加两个导航箭头，就像在 Messenger 或 Facebook 上一样。我的代码：我正在为网站制作画廊，但模态对我不起作用。我尝试了一切。如果可能的话，请添加两个导航箭头，就像在 Messenger 或 Facebook 上一样。我的代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Galéria</title> <link rel="shortcut icon" href="pics/icon.ico" type="image/x-icon"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" rel="stylesheet"> <link rel="stylesheet" href="style.css"> </head> <body> <div class="topnav" id="myTopnav" <a href="index.html">Home</a> <a href="galery.html">Galéria</a> <a href="info.html">Információk</a> <a href="javascript:void(0);"> <i></i> </a> <div id="kepek"> <img class="galleryimg" src="pics/gallery/kep (1).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (2).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (3).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (4).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (5).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (6).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (7).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (8).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (9).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (10).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (11).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (12).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (13).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (14).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (15).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (16).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (17).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (18).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (19).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (20).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (21).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (22).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (23).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (24).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (25).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (26).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (27).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (28).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (29).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (31).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (32).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (33).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (34).jpg" alt=""> <img class="galleryimg" src="pics/gallery/kep (35).jpg" alt=""> </div> <script src="app.js"></script> #kepek { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; padding: 20px; } .galleryimg { height: 26vh; width: 100%; object-fit: cover; border-radius: 5px; cursor: pointer; transition: transform 0.2s; } .galleryimg:hover { transform: scale(1.05); } 这是针对多种模式的可靠 js 解决方案：https://fancyapps.com/fancybox/ 也许它会给您一些如何在网页上构建自己的模式的线索

javascript html css modal-dialog gallery

回答 1 投票 0

重新启动后，图库中的图像权限会丢失

我的应用程序允许用户从图库或其他位置查看一些选定的图像。我通过以下方式请求图像的 Uri：意图 photoPickerIntent = new Intent(Intent.ACTION_PICK);

android image permissions gallery

回答 1 投票 0

用其他链接调用fancybox画廊

我的情况很独特。这是我的场景： 4 个链接到图库的缩略图 + 1 个中等图像（指向与第一个缩略图相同的来源）。我想通过cli打开同一个画廊...

jquery fancybox gallery

回答 2 投票 0

blueimp Gallery - 灯箱 - 自定义图像和 HTML5 视频

我们在画廊中使用 blueimp，并使用以下方法成功实现了滑块以显示具有多个来源的图像和 html5 视频这是div层：我们在画廊中使用 blueimp，并使用以下方法成功实现了滑块来显示具有多个来源的图像和 html5 视频这是div层： <div id="blueimp-video-carousel-gallery" class="blueimp-gallery blueimp-gallery-controls blueimp-gallery-carousel " data-start-slideshow="false"> <div class="slides"></div> <h3 class="title"></h3> <a class="prev">‹</a> <a class="next">›</a> <p class="description"></p> </div> 这是填充滑块的 for 循环的片段： if (_media_type == 'video') { item['title'] = "title"; item['type'] = "video/*"; item['poster'] = media_thumbnail; item['description'] = "description"; item['sources'] = [{href: _media_url_hls, type: "application/x-mpegurl"}, {href: _media_url_web, type: "video/mp4"}]; } else { item['title'] = "title"; item['type'] = "image/jpeg"; item['poster'] = media_thumbnail; item['description'] = "description"; } objArr.push(item); //// omitted for brevity blueimp.Gallery(objArr, { container: '#blueimp-video-carousel-gallery', carousel: 'true', preloadRange: 2, transitionSpeed: 400}); 接下来我们想要实现灯箱，因此我们尝试了以下操作： <div id="links" class="links"></div> <div id="blueimp-gallery" class="blueimp-gallery"> <div class="slides"></div> <h3 class="title"></h3> <a class="prev">‹</a> <a class="next">›</a> <a class="close">×</a> <a class="play-pause"></a> <ol class="indicator"></ol> </div> javascript for 循环： var linksContainer = $('#links'); var linksContainerData=''; //omitted for brevity //video linksContainerData +='<a href="'+_media_url+'" title="..." data-gallery="" class="blueimp-gallery-thumb-anchor"><img src="'+_media_thumbnail+'" ></a>'; //image linksContainerData +='<a href="'+_media_url+'" title="..." data-gallery="" class="blueimp-gallery-thumb-anchor"><img src="'+_media_thumbnail+'" ></a>'; //after loop $(linksContainer).append(linksContainerData); 这适用于图像，但无法加载视频。我们希望能够使用灯箱，但在滑块中能够播放 HTML5 HLS 和 MP4 视频。我相信可以使用 onOpen 和 onSlide 事件回调，我们可以从 jascript 数组访问数据，但我不知道如何自定义。是否可以指定 div 层而不是“a”标签，以便滑块使用自定义 div 层？非常感谢您提供的任何指导。问候，我能够让灯箱与 onClick 一起使用，通过单个条目打开轮播并处理图像和视频；视频以 hls 格式播放，并带有 mp4 后备。我在这些链接的帮助下找到了解决方案： https://blueimp.github.io/Gallery/（参见源代码） https://blueimp.github.io/Gallery/js/jquery.blueimp-gallery.js（注意：全局点击处理程序）所以我最终得到了这个功能： $(document).on('click', '[data-gallery]', function(event) { var id = $(this).data('gallery'); var widget = $(id); var selected_media_id; var media_id; var obj; selected_media_id = widget.selector; console.log("objArr.length-->"+objArr.length); for (i=0; i<objArr.length; i++) { obj = objArr[i]; if (selected_media_id == obj['title']) { break; } } return blueimp.Gallery([obj], { container : '#blueimp-gallery', carousel : true}); }); 所以我基本上获取了在属性中设置的标识符 data-gallery="identifier" 并循环遍历前面提到的构建的数组，然后使用数组 [obj] 中包含的单个对象初始化 #blueimp-gallery。缺少 [] 让我有点困惑。现在灯箱中的 onclick 会打开模态框，其中包含一个带有 x 的条目以关闭，目前效果很好。对于视频，它会以海报背景和播放图标打开，并在 Mac Safari 中播放 hls，在 Chrome 中播放 mp4。视频控件不是很好（基本的播放器控件），并且还有改进的空间，但这已经是我想要实现的基础了。希望这有帮助。 -J 我有一个滑块，当您单击照片时，照片会在灯箱中打开，对于视频，我通过在更改幻灯片时用 img 替换 video 标签解决了这个问题 $(document).on('click', '[data-gallery]', function(event) { const list = $('a[data-gallery]'); const index = $(this).data("index"); let prevVideo = null; function onClickVideo(){ const video = this; const isVideoPlaying = !!(video.currentTime > 0 && !video.paused && !video.ended && video.readyState > 2); isVideoPlaying ? video?.pause() : video?.play(); } Gallery( list, { videoContent: true, carousel: false, index,videoPlaysInline: true, onslide: function (indexSlide, slide) { prevVideo?.trigger?.('pause'); prevVideo?.off?.('click',onClickVideo); const video = $('video', $(list[indexSlide])).clone(); video.on('click',onClickVideo) $(slide).removeClass('slide-loading'); $(slide).removeClass('slide-error'); $(slide).html(video); prevVideo = video; $(video).attr('autoplay', true); $(video).attr('playsinline', true); $(video).attr('controls',true); $(video).attr('poster', ""); $(video).css({ width:"100%", height:"100%" }); video[0].play(); }, } ); })

javascript jquery html gallery blueimp

回答 2 投票 0

向 WP 主题添加精美的框

我对制作自己的 WP 主题相当陌生。现在我正在尝试弄清楚如何向其添加灯箱类型功能。我在谷歌上广泛搜索了这个主题，这是我能找到的唯一像样的教程......

jquery wordpress fancybox gallery lightbox

回答 1 投票 0

如何在 Android Kotlin 中的应用程序中将所有图像和视频获取文件夹明智？

所有图像和视频均未显示在文件夹中我希望所有图像和视频都明智地显示文件夹，并且在应用程序中工作非常顺利应用程序在所有图像和视频显示但不显示与 f...

android kotlin video gallery image-gallery

回答 1 投票 0

动态调整 Squarespace 中图库块容器的大小，以便所有图像无论方向如何都具有相同的大小

所以我的目标是让所有图像显示为相同的尺寸，即，如果水平图像是1300x1000px，那么图库中的垂直图像应该是1000x1300px。就像现在一样，画廊-