mkdocs glightbox下載 - mkdocs glightbox原始碼下載

mkdocs glightbox

其他源碼

mkdocs-glightbox-0.4.0

下載

MkDocs GLightbox

MkDocs 外掛程式支援帶有 GLightbox 的圖像燈箱。

GLightbox 是一個純 JavaScript 燈箱庫，支援行動裝置。

使用 Material for MkDocs 進行現場演示。

依賴性

GLightbox javascript 檔案和 CSS 文件
1. G燈箱==3.2.0

用法

從 PyPI 安裝插件
```
pip install mkdocs-glightbox
```
將glightbox外掛程式加入您的 mkdocs.yml 外掛程式部分：
```
 plugins :
   - glightbox
```
所有圖像都將自動添加到燈箱效果中，除了錨標記中的圖像和來自 pymdown-extensions 的表情符號圖像。

您可以透過在 mkdocs.yml 中傳遞選項來自訂插件：

 plugins :
   - glightbox :
       touchNavigation : true
       loop : false
       effect : zoom
       slide_effect : slide
       width : 100%
       height : auto
       zoomable : true
       draggable : true
       skip_classes :
         - custom-skip-class-name
       auto_caption : false
       caption_position : bottom
       background : white
       shadow : true
       manual : false

選項	預設	描述
觸摸導航	真的	啟用或停用觸控導航（滑動）。
環形	錯誤的	末端循環滑動。
影響	飛漲	打開燈箱時的效果名稱。（縮放、淡入淡出、無）
幻燈片效果	滑動	燈箱投影片上的效果名稱。（滑動、縮放、淡入淡出、無）
寬度	汽車	內聯元素和 iframe 的寬度。您可以使用任何單位，例如全寬的 90% 或 100vw。
高度	汽車	內聯元素和 iframe 的高度。您可以使用任何單位，例如 90%、100vh 或自動。
可縮放	真的	啟用或停用可縮放影像。
可拖曳的	真的	啟用或停用滑鼠拖曳以轉到上一張和下一張投影片。
跳課	[ ]	停用具有特定自訂類別名稱的圖像的燈箱。
自動標題	錯誤的	自動啟用或停用使用圖像替代品作為標題。
標題位置	底部	預設字幕位置。（下、上、左、右）
背景	白色的	燈箱圖片的背景 CSS。當圖像透明時，背景將顯示。您可以使用任何 CSS 值作為背景，例如`#74b9ff`或`Gainsboro`或`none`任何值。
陰影	真的	啟用或停用燈箱影像的陰影。當背景為`none`時禁用它，以防止透明圖像周圍出現陰影。
手動的	錯誤的	如果為 true，則必須透過向其新增`on-glb`類別或在頁面上新增`glightbox: true`元來手動為每個影像啟用 lightbox。

在 GLightbox Docs 上查看更多選項資訊。

為了獲得更大的靈活性：
1. 按圖像停用：停用特定圖像的燈箱。適合少量不需要燈箱效果的圖片。
2. 按頁面停用：停用特定頁面的燈箱。適合少量不需要燈箱效果的頁面。
3. 按圖像啟用：停用特定頁面的燈箱，但啟用這些頁面上的某些圖像。適合少量需要燈箱效果的圖片。
4. 全域停用但按影像或頁面啟用：全域停用燈箱但啟用特定影像或特定頁面。適合不需要燈箱效果的大量圖像或頁面。
支援燈箱圖片字幕，更多詳情請查看字幕。
支援將圖片分組為圖庫，更多詳情請查看圖庫。

筆記

如果這是您第一次使用 MkDocs 外掛功能，您應該知道 MkDocs 包含一個名為search預設外掛程式。如果您想保留搜尋功能，則需要將search外掛程式新增回外掛plugins清單中。

它是如何運作的

將 GLightbox 腳本檔案複製到site/assets/javascripts/目錄，將 CSS 檔案複製到site/assets/stylesheets/目錄
匯入 GLightbox 腳本和 CSS 文件，並在排除禁用頁面的每個頁面上新增 javascript 程式碼
搜尋所有圖像標籤並使用錨標籤進行扭曲，以查找 GLightbox 排除的具有跳過類別或已使用錨標籤進行扭曲的圖像