My page has a resolution of 800x480. It has been designed as such. Now in Firefox (I have control over the viewers machine), I want to zoom the whole screen to 800x600. I know that there is a zoom option, but that does it proportionally (e.g. 150%). Is it possible to somehow to only stretch the 480 to 600 (a sort of a zoom).

I have a valid reason to do this and am aware of the aspect ratio issues that could arise.

Thank you for your time.


You can use:

self.resizeTo(width, height);

Although I think Firefox has a default setting in the preferences which prevents this from working.

Mark B
I don't want to resize the window. I want zoom it from 800x480 to 800x600.
Alec Smart
So you want to stretch the content vertically?
Mark B
+4  A: 

You can do this in Firefox 3.5 (Gecko 1.9.1) using CSS3 2d transforms.

Here's an example with two DIVs where the second is stretched from 800x480 to 800x600.

<!DOCTYPE html>
        <style type="text/css">
        html, body
            background-color: #000;
            color: #fff;
            width: 800px;
            height: 480px;
            background-color: gold;
            color: #000;
            position: absolute;
            left: 0px;
            top: 0px;
            background-color: rgba(255, 0, 0, 0.5);
            -moz-transform: scaleY(1.25);
            -moz-transform-origin: 0 0;
        <div class="viewport"><button>Normal</button></div>
        <div class="viewport stretched"><br><br><button>Stretched</button></div>

See also:

super! thanks a ton. you saved a crazy amount of my time :)
Alec Smart