问题标签 [image-gallery]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
1968 浏览

jquery - jQuery 图像库

我不确定这是否是提出问题的正确地方,但我在谷歌上花了 2 个小时试图找到一些东西。

我正在寻找看起来像戴尔网站上的图片库/边秀。

www.dell.com

任何人都可以指导我一个吗?

我真的很感激。

谢谢

多姆

0 投票
1 回答
528 浏览

javascript - 在哪里可以找到基于 javascript 框架构建的专业图片库?

我正在寻找一个 Galleria 替代品,希望使用 jQuery,但其他 javascript 框架,如原型或 mootools 也很好。

我以前用过 Galleria,现在我需要一个类似的产品。不幸的是,devkick.com 域似乎在此期间消失了,我对使用未积极维护的产品持谨慎态度。

如果产品满足我的需求,我愿意为每个站点支付高达 50 美元的许可费用。

我正在专门寻找具有以下功能的画廊:

  • 图库中的每张图片都会尽快预加载,而不是在用户单击“下一步”时
  • 极简主义的默认 css 以减轻我随后的造型头痛,最好是默认的“暗室”风格,就像 Galleria 看起来一样
  • 构建图片库的每个元素都应该简单且合乎逻辑,以便用 CSS 引用
  • 就像将 CSS 类添加到单个无序列表一样容易安装
  • 除了核心 jQuery/其他库之外,没有依赖项,包括“缓动”和其他效果必须是可选的
  • 适用于 IE6、Firefox 3、Safari(和 iPhone)、Chrome、Opera 的浏览器
  • 有一个 javascript API,可以让我触发常见事件的回调函数,例如“用户点击下一步”或“图像加载”
  • 无需 javascript 即可优雅降级,将图像显示为列表,或仅显示列表中的第一个图像
  • 奖励:图库可以显示其他内容,例如视频或外部站点,例如 shadowbox-js.com 的模态框
  • 有据可查
  • 最低带宽要求 - .js 文件应缩小约 10kb
  • 奖励:图库源托管在可靠的 CDN 上,如谷歌的
  • 奖励:图像的缩略图在主图像加载之前不会出现
  • 奖励:包括使用 JSON 设置参数以更改常见行为的能力,例如滑动/淡入淡出过渡或每 X 秒自动切换图像
0 投票
1 回答
961 浏览

flash - actionscript 3.0 动态加载图像

我正在 Flash 中制作照片幻灯片,并希望能够从文件夹中动态加载图像。这样每当我有一张新照片时,我就可以将它粘贴在一个文件夹中,然后从该文件夹中读取我的 swf 文件并更新幻灯片。这在 actionscript 3.0 中可行吗?如果是这样,任何指针都会有所帮助。谢谢!

0 投票
5 回答
4688 浏览

c# - 如何使用 c#asp.net 上传多个图像(从一个文件夹)?

我如何实现从文件夹中上传所有图像,而不是一张一张地上传图像?

0 投票
1 回答
167 浏览

iphone - 将图像添加到缩略图库时失败

早上好,我一直在四处浏览,试图找出在尝试将缩略图添加到画廊视图时我做错了什么,但无法弄清楚它到底是什么。我正在尝试使用以下代码将缩略图粘贴到空白视图上:

在上面的例子中:

我正在拔头发,没有错误消息,也没有关于它为什么不画任何东西的线索。更糟糕的是,这是我唯一没有更改的代码部分之一!

0 投票
2 回答
2645 浏览

android - 在 2.1 上使用 ACTION_GET_CONTENT 在 Android 上挑选图像和视频

我正在开发一个需要让用户选择图像或视频的应用程序。在 2.1 之前的设备上,使用 ACTION_GET_CONTENT 似乎适用于多种 MIME 类型:

但是,在运行 2.1 的 Droid 上,这会给出“您的收藏中没有物品”。将相同的代码与“video/ ”或“image/ ”一起使用可以得到想要的结果。有没有办法让我的 2.1 设备允许用户在单个 Intent 中选择两种类型的内容?

0 投票
8 回答
237535 浏览

android - android 通过 Uri.getPath() 获取真实路径

我正在尝试从图库中获取图像。

从这个活动返回后,我有一个数据,其中包含 Uri。看起来像:

如何将此路径转换为真实路径(就像' /sdcard/image.png')?

谢谢

0 投票
1 回答
3848 浏览

html - 使用 Picasa 嵌入自动重复的幻灯片照片库?

如何修改来自 Google 的 Picasa 的嵌入式照片库幻灯片以自动重复图片,即一遍又一遍地播放它们?这是 Picasa 为我提供的用于嵌入网站的代码:

与此相关的是,是否有免费工具可以将 Picasa 用户名或一组照片作为输入,并自动创建一个缩略图库,可以使用 Flash 将其嵌入任何网站?

谢谢。

0 投票
1 回答
1642 浏览

asp.net - Javascript or CSS hover not working in Safari and Chrome

I have a problem with a script for a image gallery. The problem seems to only occur on Safari and Chrome, but if I refresh the page I get it to work correctly - weird!

Correct function: The gallery has a top bar, which if you hover over it, it will display a caption. Below sits the main image. At the bottom there is another bar that is a reversal of the top bar. When you hover over it, it will display thumbnails of the gallery.

The problem: In Safari and Chrome, the thumbnail holder will not display. In fact, it doesn't even show it as an active item (or a rollover). But oddly enough, if you manually refresh the page it begins to work correctly for the rest of the time you view the page. Once you have left the page and return the same error occurs again and you have to go through the same process.

Here's one of the pages to look at: link text

Here's the CSS:

height: 105px; left: 0px; position: absolute; top: 0px; width: 754px; z-index: 2; }

Here is the javascript:

var globalPath = "";

var imgMain; var gutter; var holder; var thumbs; var loadingImage; var holderState; var imgCount; var imgLoaded; var captionHolder; var captionState = 0; var captionHideTimer; var captionHideTime = 500; var thumbsHideTimer; var thumbsHideTime = 500;

$(document).ready(function() { //Load Variables imgMain = $("#MainImage"); captionHolder = $("#CaptionHolder"); gutter = $("#ThumbsGutter"); holder = $("#ThumbsHolder"); thumbs = $("#Thumbs"); loadingImage = $("#LoadingImageHolder");

});

function loadGallery(galleryID) { //Hide Holder holderState = 0; holder.css("display", "none");

}

function showCaption() { if (captionState == 0) { $("#CaptionTab").attr("src", globalPath + "/Images/CaptionTabHot.jpg"); captionHolder.css("display", "inline").css("left", imgMain.position().left + "px").css("top", imgMain.position().top + "px").css("width", imgMain.width() + "px").effect("slide", { "direction": "up" }, 500, function() { captionState = 1; }); } }

function hideCaption() { if (captionState == 1) { captionHolder.toggle("slide", { "direction": "up" }, 500, function() { $("#CaptionTab").attr("src", globalPath + "/Images/CaptionTab.jpg"); captionState = 0; }); } }

function setCaptionHideTimer() { captionHideTimer = window.setTimeout(hideCaption,captionHideTime); }

function clearCaptionHideTimer() { if(captionHideTimer) { window.clearTimeout(captionHideTimer); captionHideTimer = null; } }

function showThumbs() { if (holderState == 0) { $("#ThumbTab").attr("src", globalPath + "/Images/ThumbTabHot.jpg"); holder.effect("slide", { "direction": "down" }, 500, function() { holderState = 1; }); } }

function hideThumbs() { if (holderState == 1) { if (jQuery.browser.safari) { holder.css("display", "none"); $("#ThumbTab").attr("src", globalPath + "/Images/ThumbTab.jpg"); holderState = 0; } else { holder.toggle("slide", { "direction": "down" }, 500, function() { $("#ThumbTab").attr("src", globalPath + "/Images/ThumbTab.jpg"); holderState = 0; }); }

}

function setThumbsHideTimer() { thumbsHideTimer = window.setTimeout(hideThumbs,thumbsHideTime); }

function clearThumbsHideTimer() { if(thumbsHideTimer) { window.clearTimeout(thumbsHideTimer); thumbsHideTimer = null; } }

function setImage(image) { //Show Loading Image loadingImage.css("display", "inline");

}

function setCaption(caption) { $("#CaptionText").html(caption); //alert($("#CaptionText").html()); /* if (caption.length > 0) { $("#CaptionText") .css("display", "inline") .css("left", imgMain.position().left + "px") .css("top", imgMain.position().top + "px") .css("width", imgMain.width() + "px") .html(caption);

.css("height", $("#CaptionText").height() + 36 + "px") .css("left", imgMain.position().left + "px") .css("top", imgMain.position().top + "px") .css("width", imgMain.width() + "px"); } else { $("#CaptionText").css("display", "none"); $("#CaptionOverlay").css("display", "none"); } */ }

Please if anyone could help, it would be greatly appreciated!

Thanks in advance.

Justin

0 投票
2 回答
3463 浏览

php - 动态扫描文件夹中的图片并使用jquery幻灯片显示

任何人都知道如何使用 jquery 或 javascript 代码片段扫描文件夹,然后获取图片文件名并嵌入<li></li>or <div></div>,我使用 php 代码读取文件夹并循环遍历元素以显示缩略图和所有内容,但是效果不好。

我已经尝试过Galleria、gallerific、galleryView jquery幻灯片插件,但由于预定义的配置或其他原因,这些插件可能不适用于 php 处理,任何人都可以调整或破解这些画廊以从文件夹中动态读取图像吗?