StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>If you are seeking to animate inner frames then I would go with Dr Molle's answer. If, however you are seeking to animate a frameset, you will have to do it manually. The example below illustrates. To examine it, you 'd better use a local web server to avoid problems with cross - domain restrictions (at least in Chrome, haven't tested it anywhere else...).</p> <h3>frame1.html</h3> <pre><code><html> <body> frame 1 <br /> <a href='#' class='minimize'>Minimize</a> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type='text/javascript'> $(function () { $('.minimize').click(function (evt) { evt.preventDefault(); window.parent.minimize(); return false; }); }); </script> </body> </html> </code></pre> <h3>frame2.html</h3> <pre><code><html><body>frame 2</body></html> </code></pre> <h3>frameset.html</h3> <pre><code><html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <script type='text/javascript'> $(function () { var minimizeInterval = null; var current = 500; var pace = 15; var stop = 100; window.minimize = function () { minimizeInterval = setInterval(function () { console.log('minimizing...'); $('frameset').attr('cols', current + ',*'); current -= pace; if (current < stop) clearInterval(minimizeInterval); }, 10); }; }); </script> </head> <frameset cols="500,*"> <frame id='frame1' src="frame1.html"></frame> <frame id='frame2' src="frame2.html"></frame> </frameset> </html> </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload