iPhone에 제공 될 때 웹 페이지의 JavaScript에서 시차 이벤트를 수신하려면 어떻게해야합니까? github.com의 404 페이지를 확인했는데 가속도계를 사용하여 움직임에 반응하고 있습니다. github.com/f7fu3f73fh39f8h3f93fh398h (또는 구성 페이지)로 이동하여 멋진 시차 애니메이션을 확인하세요.
나는 소스 코드를보고 그들이 이벤트를 얻기 위해하고있는 특별한 것을 볼 수 없었다.
나는 그들이 Plax를 사용하고 있다고 생각합니다
plax 예제 페이지 에서 가속도계 항목이 해당 플러그인에 의해 처리되는 것으로 나타납니다 .
해당 페이지에 jquery 및 plax 만 포함되어 있습니다.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="js/plax.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#plax-sphere-1').plaxify({"xRange":40,"yRange":40})
$('#plax-logo').plaxify({"xRange":20,"yRange":20})
$('#plax-sphere-2').plaxify({"xRange":10,"yRange":10})
$('#plax-sphere-3').plaxify({"xRange":40,"yRange":40,"invert":true})
$.plax.enable()
})
</script>
그리고 plax.js에서 lines 209-243
// Determine if the device has an accelerometer
//
// returns true if the browser has window.DeviceMotionEvent (mobile)
function moveable(){
return (ignoreMoveable===true) ? false : window.DeviceOrientationEvent !== undefined;
}
// The values pulled from the gyroscope of a motion device.
//
// Returns an object literal with x and y as options.
function valuesFromMotion(e) {
x = e.gamma;
y = e.beta;
// Swap x and y in Landscape orientation
if (Math.abs(window.orientation) === 90) {
var a = x;
x = y;
y = a;
}
// Invert x and y in upsidedown orientations
if (window.orientation < 0) {
x = -x;
y = -y;
}
motionStartX = (motionStartX === null) ? x : motionStartX;
motionStartY = (motionStartY === null) ? y : motionStartY;
return {
x: x - motionStartX,
y: y - motionStartY
};
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다