Related styles:
-
usoMain simplerStyle
Installs:Created: Nov 07, 2013Last Updated: Nov 15, 2013 -
Created: Jul 29, 2012Last Updated: Jul 30, 2012
-
Created: May 04, 2014Last Updated: Apr 24, 2017
-
Created: Sep 03, 2015Last Updated: Feb 23, 2016
-
Created: Feb 07, 2016Last Updated: Mar 05, 2016
-
Created: May 21, 2016Last Updated: Jun 07, 2016
-
Created: Nov 22, 2011Last Updated: Apr 16, 2017
-
Created: Mar 17, 2016Last Updated: Jan 15, 2017
-
Created: Sep 21, 2014Last Updated: Jun 20, 2016
mod_wastrel@userstyles deleted this style because of "The site is now using Lightbox for screenshots."
Try usoMain simplerStyle instead of this deleted style.
See more styles for Userstyles.org
us.o: wide-screen[shots] custom[s]ized
Description:
More info
Terse: use more page space for larger images on wide-screen monitors, click on an image to maximize the view (fit to window)
Verbose:
This style is designed to make better use of wide-screen monitors for viewing the screenshots displayed on style pages. One screenshot by itself or two together ('Before' and 'After') will be able to use [almost] the entire width or height of the content window (maintaining aspect ratio), depending on whether the image(s) is(/are) wider rather than taller or vice versa. Primarily, though, side-by-side screenshots can run margin to margin. If images are still not at their native size, you can click on the image--holding the mouse button down while you view it and releasing it when you're finished viewing it--and maximize it to the content window (again, maintaining aspect ratio). Note, though, that images are *not* zoomed to a size larger than their native resolution; there are plenty of other methods available to enlarge an image that way. Lastly, if an image has still not reached its native resolution you can maximize the browser window or view the image in another tab/window and maximize it there where you can scroll it left/right and up/down.
So, features...
(a) larger images by default, arranged side-by-side for wide-screen monitors (presuming, of course, you've sized your browser to match)
(b) click on an image [w/o releasing the mouse button] to maximize it to fit the content window or reach its native resolution, whichever comes first
(c) click and drag an image (by enough to get the "forbidden" icon: the circle with a slash) to keep it maximized until you click on the image again
(d) standard image handling by Firefox (e.g., right-click -> View Image [opt. with the 'Ctrl' key] in the same tab/window [or a new one])
---- ---- ---- ----
You can use this style with standard monitors, too; it's just more certain that you'll have to adjust the values in the code (via one of the methods in the FAQs discussion).
Setup
After installing this style you'll have a blue outline around the screenshot area and red reminder text above the screenshot(s). If you find the default settings in the style for max-width and/or max-height inappropriate for your monitor, then you should change them to suit your browser window's dimensions. (Outside of occasionally maximizing their browser, most people seldom change the size of their browser window. The CSS code in this style is ready for use with a typical wide-screen monitor, but this style is written to use custom values provided by each user.) If you need/want to modify the sizing values in the code to better suit your browser window, then follow the FAQs discussion link below. You can easily disable the code to generate the box and the reminder text whenever you want; the box is just there to assist you with determining satisfactory sizing values for your browser window. (FWIW, my content window is about 1300x650, so if yours is about that size or larger, then the default values here should work alright for you.)
---- ---- ---- ----
Updates...
04Aug1010: added a z-index ('cause, apparently, there are some who *don't* hide the ads)
24Jun2010: change cursor to pointer when image is hovered
* * * * * * * *
In the screenshots below the 'Before' image is the standard view of a Before/After screenshot pair. The 'After' image shows one of the screenshots in the maximized view. (FWIW, the style in the screenshots is http://freestyler.ws/style/8823/gmail-remove-ads-and-relocate-action-links by lOtR@userstyles.)
First install FreeStyler to use this style.
If you already installed it, please, make sure this site is allowed to run JavaScript.But you can download Freestyler for other browsers and apply styles there!
Applies to:
http://userstyles.org/styles/