html - Resize video javascript -


i need button resize video on webpage. button must on first click make video bigger, , on second click make video smaller. understand need variable keep track of whether video should made bigger or smaller.

<!doctype html> <html> <head> <title>simple animations in html5</title> </head> <body> <h2> optical illusion </h2> <video id="illusion" width="640" height="480" controls>   <source src="illusion_movie.ogg"> </video>  <div id="buttonbar">  <button onclick="changesize()">big/small</button> </div>  <p> watch animation 1 minute, staring @ centre of image. @         else near you. few seconds appear distort. source: <a href="http://en.wikipedia.org/wiki/file:illusion_movie.ogg">wikipedia:illusion     movie</a> </p>  <script> var myvideo=document.getelementbyid("illusion"); var togglesize = false  if togglesize == true { function changesize() { myvideo.width=800; togglesize = false; } } else { function changesize() { myvideo.width = 400; togglesize = true; } } </script> </body> </html> 

attache function on click event;

var littlesize = false; function changesize() {   myvideo.width = littlesize ? 800 : 400;   littlesize = !littlesize;//toggle boolean } 

http://jsfiddle.net/unlhl/


Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -