the-turk/flarum-ext-fancybox

使用fancyBox进行图像格式化和灯箱模态(从squeevee的版本衍生而来)。

安装: 208

依赖项: 0

建议者: 0

安全: 0

星标: 0

关注者: 1

分支: 5

开放问题: 0

语言:JavaScript

类型:flarum-extension

0.2.0-beta.4 2020-05-22 22:40 UTC

This package is auto-updated.

Last update: 2024-09-23 09:53:05 UTC


README

GPLv3 license Latest Stable Version Total Downloads

免责声明:本扩展是从 squeevee/flarum-ext-fancybox 衍生而来的。

fancyBox

功能

  • 基于 fancyBox v3
  • 在帖子中单击图像将启动fancyBox模态。这允许用户放大图像、平移和在同一个帖子中的多个图像、视频或iframe之间导航,就像相册一样。
  • 图像以格式化显示,以规范化大小和布局。
  • 如果帖子的作者在图像周围添加了链接,它将作为外部链接显示。(在这种情况下,单击图像不会启动fancyBox模态。)
  • 图像或URL标题被视为标题。

注意:本扩展不生成缩略图。图像的存储位置,以及文件大小/带宽使用量不受影响。

冲突

  • 此软件包与 squeevee/flarum-ext-fancybox 冲突,因此您需要先删除它。
  • 看起来这个软件包似乎与 reflar/recache 不兼容(见 #4)。

安装

composer require the-turk/flarum-ext-fancybox

更新

composer update the-turk/flarum-ext-fancybox
php flarum cache:clear

使用

启用扩展。

图像布局

可以通过帖子标记的格式(例如,其BBCode或Markdown)来控制图像布局。

如果图像不在包含任何文本或其他图像的段落中,即它通过至少两个换行符与其他文本或图像分开,则该图像是“独立”的。独立图像以大格式显示。

Example of a stand-alone image

如果图像在包含文本或其他图像的段落中,则该图像是“内联”的。内联图像以小格式显示,以便适应文本流。

Example of an inline image

(由于技术原因,如果图像仅通过一个换行符与其他文本或图像分开,则被视为内联。)

如果您有 flarum/bbcode 扩展,您可以使用 [img fancy=off][/img] 来防止图像被此扩展格式化。这将也将它们排除在帖子的fancyBox画廊之外。

链接

如功能部分所述,如果图像被链接包裹,则其行为和外观将改变。最值得注意的是,为了保留链接,单击图像将打开链接而不是打开fancyBox模态。链接内的图像也不会添加到帖子的fancyBox画廊中。

External linked image

尽管如此,如果您有 flarum/bbcode 扩展,您可以使用 URL 标签的 fancy 属性来在fancyBox模态上显示视频或iframe。它们将被添加到帖子的fancyBox画廊中。

  • 使用 [URL fancy=iframe] 为iframe

    Iframe

  • 使用 [URL fancy=video] 为视频(fancyBox支持YouTube、Vimeo & MP4)

    Video

标题

您需要拥有 flarum/bbcode 扩展才能添加标题。将自动将 IMGURL 标签的 title 属性视为标题(IMG 标签具有更高的优先级)。以下是一些可能的用法示例

Caption

[img title="Caption this."][/img]
[url title="Caption this." fancy]![](src)[/url]
[url title="Caption this." fancy=video][img][/img][/url]
[url fancy][img title="Caption this."][/img][/url]

链接