UserJS.org

Autosizer

Learn how to install scripts

Report a bug

This script can best be described as “The Opera image viewer on steroids”, especially when combined with the Image preloader.

This script activates when you use Opera to view an image file. (JPEG, GIF, BMP and PNG are recognized types), and adds five different viewing modes for images:

  1. Original: In this mode, the image will be viewed in it’s original size.
  2. Shrink to Fit: Images that are bigger than the viewport (viewable image area), are resized so the entire image fits on screen, while images that already fit into the viewport will not be resized.
  3. Maximize: Images that are smaller than the viewport are enlarged to fill the entire viewport, and images that are larger than the viewport are shrunk to fit to the viewport.
  4. Fit to Width: Images are resized to fill the entire viewport width.
  5. Fit to Height: As with Fit to Width, but this resizes the image so it fills the viewport height instead.

In all of the different viewing modes, the aspect ratio of the image viewed is preserved, so that you won’t see images where the proportions are distorted.

When you browse images, your current settings are saved in a cookie. This cookie is set on a per-domain basis.

Help

Using the mouse

Changing viewing mode using the mouse is done by simply clicking on the image, which will change to the next mode. To toggle to the previous viewing mode, you hold down shift while clicking.

Using the menu

In the top right corner of the viewport, there is an indicator that displays the current viewing mode. When you mouse over this indicator, a menu drops down, allowing you to choose the desired viewing mode.

Using the keyboard

If you prefer using the keyboard, the image settings are available as such:

  • M: Next viewing mode
  • N: Previous viewing mode
  • B: Toggle indicator mode

The “Indicator mode” toggle puts the indicator mode into one of three states:

  1. Always visible
  2. Autohide: Hides the indicator after 750ms.
  3. Off

Customizing Autosizer

There are quite a few options you can set in Autosizer, that are found right below begin:user settings in the source code of the script.

Default viewing mode

var default_mode = 2; 

Alters the default viewing mode for the script, and values should be in the range from 1 to 5, corresponding to the five different viewing modes:

  1. Original
  2. Shrink to Fit (default)
  3. Maximize
  4. Fit to Width
  5. Fit to Height

This setting is used only when cookies are disabled, or when no preference for the current domain has yet been set.

Default indicator mode

var default_indicator = 1;

Sets the default mode for the on-screen indicator.

  • 0: Always on
  • 1: On after mode_switch / page load (Default)
  • 2: Always off

Indicator autohide delay

this.indicator_delay = 750;

Sets how long the indicator should stay visible when in autohide mode. The default value is 750 ms

Cookie permissions

var cookie_allowed = true;

If you don’t want Autosizer to store the setting in a cookie, set this to false.

Visual settings

var indicator_color= "#333";

Text color for the indicator and selector menu. Accepts a CSS2.1 color value

var indicator_hover_color = "red";

Text color when hovering items in the selector menu. Accepts a CSS2.1 color value.

var indicator_background = "#eee";

Background color for the mode indicator. Accepts the same values as the CSS2.1 background property

var selector_background = "#f5f5f5";

Background color for the mode selector. Accepts the same values as the CSS2.1 background property

var selector_selected_background = "#fff";

Background color for the active mode in the mode selector. Accepts the same values as the CSS2.1 background property

Changelog

  • 1.0.2: Fixed a missing scrollbar bug for Opera 9.
  • 1.0.1: Fixed a bug that prevented the script from loading under certain conditions.