क्या कोई जानता है कि ओलंपिक के लिए Google इंटरएक्टिव डूडल्स कैसे काम करते हैं। http://www.google.com/doodles/soccer-2012Google इंटरेक्टिव डूडल
मुझे लगता है कि डिव hplogo है और शैली की तरह यह ऊपर सही है,:
#hplogo{background:url(/logos/2012/soccer12-hp.png)....
मैं समझ नहीं कैसे स्कोर गणना की जाती है; वस्तुओं को कैसे स्थानांतरित किया जाता है, आदि। क्या यह एक पठनीय जेएस फ़ाइल है? अग्रिम धन्यवाद।
निष्ठा से, एक साथी डेवलपर
कुछ डूडल एनिमेशन दिखाने के लिए कैनवास का उपयोग करते हैं। लोड की गई छवि से ली गई विभिन्न फ्रेम जावास्क्रिप्ट में टाइमर का उपयोग करके खींची जाती हैं।
कुछ उपयोग सीएसएस संपत्ति background-image। सीएसएस संपत्ति background-position एनीमेशन बनाने के लिए जावास्क्रिप्ट टाइमर का उपयोग कर बदल दिया गया है।
एनिमेशन अधिक जावास्क्रिप्ट का उपयोग करके इंटरैक्टिव बनाये जाते हैं।
उदाहरण के लिए: http://www.google.com/logos/2012/hurdles12-hp-sprite.png, http://www.google.com/logos/2012/basketball12-hp-anim.png
आप अद्भुत हैं! मुझे एक्सएनए के साथ कुछ अनुभव था और मैं सोच रहा था कि क्या वे तस्वीर के लिए कोई अपडेट कर रहे हैं या जेएस के माध्यम से मैन्युअल रूप से बॉडी पार्ट्स ले जा रहे हैं। आपको बहुत - बहुत धन्यवाद! यह बहुत मदद करता है। –
आपका स्वागत है :)। Google डूडल वास्तव में कमाल हैं। यह सबसे अच्छा मुझे लगता है - http://www.google.com/logos/2011/lespaul.html। यह कैनवास, अन्य HTML तत्वों और ऑडियो का उपयोग करता है। – Diode
वोहा कि वास्तव में अच्छा है :) मुझे नहीं पता था कि ऑडियो इस तरह इस्तेमाल किया जा सकता है। धन्यवाद एक थोन, मैंने आज सोचा कि मैं आज से ज्यादा सोचता हूं। –
आप कैसे एक डिबगर के साथ पेज स्रोत कोड को देखना पता है? Google क्रोम में, बस F12 पर क्लिक करें। डीबगर खोलें और आप फाइलें देख सकते हैं। आपको JavaScript file दिखाई देगा। आप cleaning it up द्वारा इसे और अधिक पठनीय बना सकते हैं, लेकिन यह संपीड़ित चर नाम होंगे।
धन्यवाद, मैं बस यही देख रहा था! –
ग्रेट लिंक http://jsbeautifier.org/ :) – mtk
एक और महत्वपूर्ण सवाल: कितने बचाता है आप सोना पाने के लिए की जरूरत है? –
हाहा महान सवाल। मैं सक्षम नहीं था :) –
इसी तरह के प्रश्न का मेरा जवाब देखें [एचटीएमएल 5 गेम कैसे करें जैसे Google डूडल के डॉक्टर कौन?] (Http://stackoverflow.com/questions/20136141/how-to-make-html5- गेम्स-जैसे-google-doodles-doctor-who/20150126 # 20150126) – nmoliveira