[Image Preview] - A native, lightweight image preview plugin

Plugins
#1

Hi everyone,

I’d like to share a new plugin I’ve been working on: image-preview.

This plugin brings a modern, click-to-enlarge image viewing experience to TiddlyWiki using pure native JavaScript. It is designed to be extremely lightweight and fast, with zero external dependencies.

Key Features:

Native & Lightweight: Built with pure JS/CSS. No external libraries required.
Smooth Interaction: Full-screen preview with zoom support (mouse wheel & controls) and free panning.
Gallery Navigation: Automatically detects images on the same page and allows seamless navigation between them.
Keyboard Support: Full shortcuts support (ESC to close, Arrows to navigate, Ctrl +/- to zoom).
Dynamic Support: Works out of the box with dynamically loaded content.
Usage:

Simply install the plugin. Clicking on any image in your wiki will automatically open the preview modal.

Try it Now

6 Likes
#2

Sweet. :clap:

I’m liking your Advanced Search plugin even more. :heart:

1 Like
#3

This is brilliant! :rocket:

It is a perfect direct answer to a question I asked recently. Although I love Saq’s lightbox port, this is much simpler for me to use. Thank you very much for sharing.

1 Like
#4

Very nice.

Automatically detects images on the same page

Would it be possible to restrict this to just a given tiddler for example? I appreciate this is basically a feature request!

On a minor note that, you seem to be using Markdown syntax for your readme file but your readme has the type text/vnd.tiddlywiki (so it should use TiddlyWiki Wikitext). This is also the case for your Advanced Search plugin FWIW.

#5

I don’t have time to tinker with it yet but I like it! A big upgrade from Medium Zoom Plugin.

My issue with it so far is that it is pretty aggressive in making image previewable. This is include image in button, in element with CSS marked as unselectable, and even in insert image menu when editing tiddler too!

The text in bottom button is showing as . in my wiki as well.