---
title: "图像浏览工具 "
description: "默认会对文章内的图片， 进行图片浏览，点击图片可以查看大图，点击空白处可以关闭。"
keywords: "image,图像,浏览器,相册"

date: 2024-07-21T10:28:12+08:00
lastmod: 2024-07-21T10:28:12+08:00

categories:
  - 示例文章

tags:
  - 图像
  - 相册
  - 浏览

url: "demo/image-viewer.html"
toc: false
expired: true
---

本主题自带图像浏览器功能，支持对文章区域内出现的图片进行浏览，点击图片可以查看大图，点击空白处可以关闭。不需要配置任何参数，只要在文章里面相应的位置添加图片信息即可 。

<!--more-->

图像浏览器引用了 [fengyuanchen](https://fengyuanchen.github.io/) 开发的 [viewerjs](https://fengyuanchen.github.io/viewerjs/)，支持显示图像名称，尺寸，旋转，缩放，播放等功能。可点击如下的示例图像查看体验：

## 动物

![cute-scottish-fold-cat](/post/image-viewer/preview_cute-scottish-fold-cat.jpg)
![scottish-fold-kitten](/post/image-viewer/preview_scottish-fold-kitten.jpg)
![hourses](/post/image-viewer/preview_horses.jpg)
![owl-family-background](/post/image-viewer/preview_owl-family-background.jpg)

## 风景

![luxury-resort-in-maldives](/post/image-viewer/preview_luxury-resort-in-maldives.jpg)
![sea-shell](/post/image-viewer/preview_sea-shell.jpg)
![the-arch-sunset](/post/image-viewer/preview_the-arch-sunset.jpg)
![norway-autumn-landscape](/post/image-viewer/preview_norway-autumn-landscape.jpg)