User:Zocky/Picture Popups

Zocky's javascript tools

Picture Popups - the Javascript tool that makes clicking on image thumbnails work As Nature Intended. users Now for Vector! users
Search Box - search and replace in the edit box. users
Auto Complete - auto complete titles of articles in the search input box on the left. users
Link Complete - auto complete titles of articles when typing links in the edit box. users

Picture popups is a Javascript tool which makes clicking on image thumbnails work As Nature Intended. Normally, clicking on a thumbnail takes you to the image page with the large version of the image and information about it. With Picture Popups, the image, its caption and licensing information are displayed in a popup window inside the article page. users

Features

[Screenshot needed]

See images without leaving the article you are reading

Clicking on an image will popup the image inside the page you are viewing.
Click [-] to minimize/restore, [×] to close the popup, and [>] to go to the image page, click and drag to move.
The displayed image is the same size as on the image pages. This size can be changed in your preferences, under Files.

Licensing information

For many images, there will be a copyright icon displayed in the upper left corner. Hovering over it with the mouse will display the license. For an ongoing project to include machine-readable information in all image license templates see {{image-license}}.

HTML/CSS popups

Popups always stay on top of the text.
No new windows are opened on your desktop. When you leave the page, the popups disappear with it.

Enlarge images in place

Clicking on the enlarge icon under any thumbnail will enlarge the image in place.
You can switch its size back by clicking on the enlarge icon again.

Installation

Currently, the tool works in Firefox and Mozilla. In Opera, it works with some quirks: minimizing works incorrectly and copyright information is not displayed. I am looking into making it work in Internet Explorer.

Vector

Edit your vector.js and paste in this line:

// [[User:Zocky/PicturePopupsVector.js]]
importScript('User:Zocky/PicturePopupsVector.js');

By default, popups display 800×600 pixel images. To change this to e.g. 640×480, add the following lines:

window.picturePopupsWidth = 640;
window.picturePopupsHeight = 480;

Clear your browser's cache and when you click an image thumbnail, a picture popup should appear.

To install the script on the commons or wiktionary, repeat this procedure on those wikis.

To uninstall the script, delete those lines from your javascript file and clear your browser's cache.

Other skins

You have to create (or edit) a file in your userspace. For most people who don't use vector, this file is called User:USERNAME/monobook.js where you should replace USERNAME with your username. Note that the case is important here: it's monobook.js and not Monobook.js.

(People using the classic skin should edit standard.js instead, and people using other skins probably know which file to edit :-)

Edit that page and paste in this line:

{{subst:User:Zocky/PicturePopups}}

Clear your browser's cache and when you click an image thumbnail, a picture popup should appear.

To install the script on the commons or wiktionary, repeat this procedure on those wikis.