في الآونة الأخيرة ، عندما استخدمت تطبيق Ofo Little Yellow Car ، وجدت أن الكاسحة السابقة أدناه أصبحت رجلًا أصفرًا صغيرًا ، وشعرت هنا بالاهتمام.
تأثير العين تحليل التأثيرليس من الصعب أن نرى من التأثير الذي يتحقق حدث الجيروسكوب.
دعونا نلقي نظرة على بعض مفاهيم حدث الجيروسكوب في HTML5.
حدث الجيروسكوب هو deviceorientation ، الذي يحصل بشكل أساسي على alpha و beta و gamma في هذا الحدث.
عندما يتم وضع الجهاز المحمول أفقياً ، تكون زاوية الدوران حول محور Z 0 درجة إلى 360 درجة.
بيتاعندما يتم وضع الجهاز المحمول أفقياً ، زاوية الدوران حول المحور السيني ، تكون القيمة -180 درجة إلى 180 درجة.
جاماعندما يتم وضع العملية أفقياً ، تكون زاوية الدوران حول محور Z هي قيمة -90 درجة إلى 90 درجة.
هنا ، تحتاج فقط إلى استخدام Beta و Gamma.
قم بفك ضغط APK واحصل على مادة العين:
تنفيذ الكود <! = no> <title> مستند </title> <style> #box {ذات الصلة: 300px ؛ الغلاف ؛ الأعلى: 90px ؛ Background-Images: url (Glass.png) ؛ = box> <div id = face> </viv> <div id = eyeleft> </viv> <div id = eyeright> </viv> <div id = glass> </viv> <div id = log> < /div> </viv> <script> 'استخدم صارمًا' ؛/** المؤلف: وانغ leping* التاريخ: 2017.7.17*/var eyeleftposition = {start: [70 ، 78] ، النهاية: [100 ، 110]} ؛ : (eyeleftposition.end [1] -emeleftposition [1]) / 2 + eyeleftposition [1]} ؛ [0] ، y: (eyerightposition.end [1] -yerightposition.start [1]) / 2 + eyerightposition.start [1]} ؛ ) ؛ style.left = eyeleftcenterposition.x + gamma / 90 * r + 'px' ؛ / 180 * r + 'px' ؛ document.queryselector ('body').التأثير النهائي
ما سبق هو كل محتويات هذا المقال.