Czy ktoś wie, jak działają interaktywne gry Google do igrzysk olimpijskich? http://www.google.com/doodles/soccer-2012Google Interactive Doodle
Uważam, że strefa jest hplogo i styl jest tuż nad nim, jak:
#hplogo{background:url(/logos/2012/soccer12-hp.png)....
nie mogę dowiedzieć się, w jaki sposób wynik jest obliczany; Jak przenoszone są obiekty itp. Czy jest to czytelny plik JS? Z góry dzięki.
poważaniem Kolega deweloper
Niektóre gryzmoły wykorzystują Canvas do wyświetlania animacji. Różne klatki pobrane z załadowanego obrazu są rysowane za pomocą timera w javascript.
Niektórzy używają własności CSS background-image. Właściwość CSS background-position została zmieniona za pomocą timera javascript w celu utworzenia animacji.
Animacje są interaktywne przy użyciu większej ilości javascript.
np: http://www.google.com/logos/2012/hurdles12-hp-sprite.png, http://www.google.com/logos/2012/basketball12-hp-anim.png
Jesteś niesamowity! Miałem pewne doświadczenie z XNA i zastanawiałem się, czy robią one aktualizacje obrazu lub przenoszenie części ciała ręcznie za pomocą JS. Dziękuję bardzo! Pomaga to dużo. –
Serdecznie zapraszamy :). Dyski Google są naprawdę niesamowite. Ten jest najlepszy, jak sądzę - http://www.google.com/logos/2011/lespaul.html. Wykorzystuje Canvas, inne elementy HTML i Audio. – Diode
Woah, który jest naprawdę fajny :) Nie wiedziałem, że dźwięk może być używany w ten sposób. Dzięki Thon nauczyłem się dużo więcej, niż myślałem dzisiaj. –
Czy wiesz jak wyświetlić kod źródłowy strony z debuggera? W przeglądarce Google Chrome kliknij F12. Otwórz debugger i zobaczysz pliki. Zauważysz JavaScript file. Możesz uczynić go bardziej czytelnym przez cleaning it up, ale będą to skompresowane nazwy zmiennych.
To wszystko, czego szukałem! –
Świetny link http://jsbeautifier.org/ :) – mtk
bardziej istotne pytanie: Ile oszczędza nie trzeba uzyskać złoto? –
Haha wielkie pytanie. Nie byłem w stanie :) –
Sprawdź moją odpowiedź na podobne pytanie [Jak tworzyć gry HTML5, takie jak Google Doodle's Doctor Who?] (Http://stackoverflow.com/questions/20136141/how-to-make-html5- gry-jak-google-doodles-doctor-who/20150126 # 20150126) – nmoliveira