A HTML5 platform demókon keresztül
•
0 gefällt mir•428 views
Az előadás témája a HTML5 platform programozása: - canvas, - svg, - audio, - video, - webfonts Az előadás megtekinthető itt: http://devportal.hu/tv/Default.aspx?auth=0&sid=92353d2f-32a4-41e0-97f6-3a2663598249
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (10)
Andere mochten auch
Andere mochten auch (20)
Ähnlich wie A HTML5 platform demókon keresztül
Ähnlich wie A HTML5 platform demókon keresztül (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
A HTML5 platform demókon keresztül
- 1. HTML5 platform Canvas, SVG, Web fonts, Audio, Video, … Dávid Zoltán david.zoltan@aut.bme.hu BMEAAIT
- 2. Demo
- 3. Canvas var canvas = document.getElementById('rajztabla'); var ctx = canvas.getContext('2d'); ctx.fillStyle = 'rgba( 0, 255, 0, 0.5 )'; ctx.translate(300, 250); for (var i = 0; i < 10; i++) { ctx.rotate(0.2 * Math.PI); ctx.fillRect(20, 0, 200, 100); } PAGE 3
- 4. SVG <!DOCTYPE html> <html> <body> <svg> <rect width="600" height="150" style="fill:red" /> <rect width="600" height="150" y="150" style="fill:white" /> <rect width="600" height="150" y="300" style="fill:green" /> </svg> </body> </html> PAGE 4
- 5. @font-face @font-face { font-family: SajatFont; src: url("myfont.woff"); } <p style="font: 20pt SajatFont"> Richter Elemér, kilenc kutya, hat egér </p> PAGE 5
- 6. Video <video id="myVideo" loop controls onmouseover="this.play()" onmouseout="this.pause()"> <source src="video.mp4"> </video> PAGE 6
- 7. Audio <audio id="player" controls src='zene.mp3'> </audio> document.getElementById('player').volume = 0.5; document.getElementById('player').play(); document.getElementById('player').pause(); document.getElementById('player').currentTime = 0; PAGE 7
- 10. Van-e local storage? function supports_html5_storage() { try { return 'localStorage' in window && window['localStorage'] !== null; } catch (e) { return false; } } PAGE 10
- 11. Van-e local storage? - Modernizr if (Modernizr.localstorage) PAGE 11
- 13. © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Internet Explorer and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION. Thank you.