80 likes | 326 Views
HTML5 Discuss. @ 翁玉礼. Compare to html4. Canvas Video and audio Local offline store New form control . Canvas. <canvas id=" myCanvas "></canvas> < script type="text/ javascript "> var canvas= document.getElementById (' myCanvas '); var ctx = canvas.getContext ('2d'); //get context
E N D
HTML5 Discuss @翁玉礼
Compare to html4 • Canvas • Video and audio • Local offline store • New form control
Canvas <canvas id="myCanvas"></canvas> <script type="text/javascript"> varcanvas=document.getElementById('myCanvas'); varctx=canvas.getContext('2d'); //get context ctx.fillStyle='#FF0000'; //draw color ctx.fillRect(0,0,80,100); //fill in </script>
Video(new) <video src="movie.ogg" controls="controls"> Tips:Your browser not support video markup </video>
Video(old) <object id=video width=300 height=330 classid=“clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6"> <paramname=urlvalue=“abcd.wmv"> <paramname=autostart value="1"></object> OR <embed src=“abcd.wmv" type=audio/x-pn-realaudio-plugin height=124 width=180 autostart=true loop=true>
offline storage • localStorage • //no time limit localStorage.lastname=“leon"; document.write(localStorage.lastname); • sessionStorage • //for one session • sessionStorage.lastname=“leon"; document.write(sessionStorage.lastname);
New form control Email、url、number、range、date pickers、search、color…