breakpo

אני ואחי יצרנו תצוגה מעניינת לראות אירועים יום יומיים ישראלים . כמה כסף עיריית תל-אביב עושה מדוחות על חניות ? - כמה כסף מרוויח בנק הפועלים בשניה ? - כל כמה זמן נולד ילד במדינה ? / מישהו מתגייס ? / כמה שקיות במבה מיוצרות בשנייה ? ... ועוד ועוד. צריך לראות כדי להבין: תדירות ישראלית

כתבתי משהו נחמד שמאפשר ניהול גלובאלי של היומן. במקום לרוץ בין שבועות וחודשים הוספתי תצוגה שנתית של היומן. השתמשתי ב - html5 ו - SVG בשביל לאפשר זום (zoom in ו - zoom out) לימים ביומן. כך אפשר לראות גם מבט כללי על היומן "ממעוף הציפור" וגם לצלול ולרדת לפרטים של פגישות ביום יום. סרטון הדגמה: הדגמה חיה: להוספת תוסף לכרום: https://chrome.google.com/webstore/detail/unique-yearly-view-for-go/dikklhbmogaoiococnppcfkonljeadll לאתר האפליקציה: https://www.c2kb.com/calendar

רבים וטובים (וגם אני) משתמשים ב - setTimeout או setInterval בשביל ליצר אנימציה ב - HTML5 JavaScript עם Canvas Tag. מתכנתים ותיקים בוודאי זוכרים את Vertical Sync שהיינו משתמשים ב - Assembler בכדי להשיג תנועה חלקה. לאחרונה גיליתי יכולת חדשה של ה - browser בכדי לספק לנו דבר דומה בתכנות JavaScript ב- HTML5 עבור Canvas. במקום להשתמש ב - setIntrerval / setTimeout ניתן להשתמש ב - requestAnimationFrame אשר קורא לפונקציית הציור של התמונה בקצב המהיר ביותר האפשרי מבחינת ה - browser. הנה השימוש, בכדי להשיד תמיכה בכל הדפדפנים: var animationFrame = window.requestAnimationFrame ||  window.webkitRequestAnimationFrame ||  window.mozRequestAnimationFrame ||  window.oRequestAnimationFrame ||  window.msRequestAnimationFrame ||  null ; לפוסט המקורי

שיחקתי קצת עם HTML5 Canvas וכמובן JavaScript וזה מה שיצא: להורדה לכרום - עובד גם ללא חיבור לאינטרנט: https://chrome.google.com/webstore/detail/pkfcbmdddigmhfifefpomilfclfpgmli Planet Commander משחק דפדפן שבו צריך לכבוש כוכבים שונים. אשמח לשמוע את דעתכם. http://www.cnaanaviv.com/stars

לינקים מעניינים, חומרים, מצגות, משחקים והדגמות ל - HTML5 Slides HTML5 Rocks Slides (2010) HTML5 Latest Slides (2011-07-01) Shows Introduction to HTML5 Mobile: HTML5 vs Android Native HTML5 tutorials Demos & Games Chrome Expiriments CE: WebGL: Jelly Fish CE: Game: z-type CE: Video: Video Explosion Video: Stack & Rotate Video: Subtitles Game: Tetris Game: AngryBirds CSS3 Playground Humble Graphs gRaphaël Resources W3C HTML5 spec HTML5 Logo Mozilla tutorial rotating video HTML5 Using Form Validation Patterns Test your browser for HTML5 completness HTML5 Snippets Howto HTML/5 Elements Browser Compare Form Elements Browser Support IE9 vs. FF4 When can i use? HTML5 Browser Support HTML5 Readiness CSS3 Selectors CSS3 Selectors and Competability CSS3 Elements and Support