css - 调整画廊中缩略图的渲染

标签 css internet-explorer-8 galleria

我正在研究 Galleria 的经典主题以展示画廊。这里的要求是如果缩略图列表 div 宽度增加超过 24,则使用水平滚动条按以下顺序在两行中显示缩略图和图像。

1 3 5 7 9  11 13 15 17 19 21 23 ..

2 4 6 8 10 12 14 16 18 20 22 24 ..

如果图像小于 24 且大于 12,则顺序应呈现为两行:-

1 2 3 4 5 6 7 8 9 10 11 12

13 14 15 ..

如果图像少于 12,则图像应在单行中呈现为:-

1 2 3 4 5 6 7...

目前我所做的是使用 css3 列属性根据图像计数使用不同的类来执行此操作。这适用于所有浏览器,但在 IE8 中。

那么,对于 IE8 或更低版本,是否有任何替代 css3 列属性的方法。或者一些更好的方法来实现在 IE 中也能正常工作的东西。

最佳答案

在 IE8 中没有直接替代列。要解决此问题,您将需要检测缩略图的数量,然后适本地分配类,并编写自定义 css 类。

因此,您可以向缩略图容器添加一个“列”类,然后编写您已经拥有的 css 以使列正确显示(可能需要调整),然后编写另一个类以具有不同的显示效果。

也就是说,galleria 确实没有为此提供最简单的 API。

关于css - 调整画廊中缩略图的渲染,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13156345/

相关文章:

javascript - 100% 高度响应式标题

jquery - 在悬停在下拉列表中的 <li> 上时创建子菜单。就像 Udemy 网站下拉菜单一样

css - Bootstrap 3 col-xs-.. 在 ie8 中覆盖 -sm -md 等..

javascript - Jquery Galleria Classic Skin - 缩略图行而不是滚动

jquery - 画廊图片库

javascript - 为什么在 Spring-MVC 4 中加载 css/js 时出现 HTTP 405 错误?

jquery - Bootstrap 2.2.1 中的弹出框

css - Internet Explorer 中的 Z 索引

javascript - 表单输出到同一类的多个跨度,支持 JavaScript+IE8

javascript - 当属性被缓存在 JavaScript 中时,如何提取属性的值?