Create a parallax effect between an array of layers, driving the motion from the gyroscope output of a smartdevice. If no gyroscope is available, the cursor position is used. -- 2
$10-350 USD
キャンセル
投稿日: 8年以上前
$10-350 USD
完了時にお支払い
We would like to create a single page parallax scrolling effect similar [login to view URL] (La Carte)
// Strict Mode
'use strict';
// Constants
var NAME = 'parallax';
var MAGIC_NUMBER = 30;
var DEFAULTS = {
relativeInput: false,
clipRelativeInput: false,
calibrationThreshold: 100,
calibrationDelay: 500,
supportDelay: 500,
calibrateX: false,
calibrateY: true,
invertX: true,
invertY: true,
limitX: false,
limitY: false,
scalarX: 10.0,
scalarY: 10.0,
frictionX: 0.1,
frictionY: 0.1,
originX: 0.5,
originY: 0.5
};
function Plugin(element, options) {
// DOM Context
[login to view URL] = element;
// Selections
this.$context = $(element).data('api', this);
this.$layers = this.$[login to view URL]('.layer');
// Data Extraction
var data = {
calibrateX: this.$[login to view URL]('calibrate-x') || null,
calibrateY: this.$[login to view URL]('calibrate-y') || null,
invertX: this.$[login to view URL]('invert-x') || null,
invertY: this.$[login to view URL]('invert-y') || null,
limitX: parseFloat(this.$[login to view URL]('limit-x')) || null,
limitY: parseFloat(this.$[login to view URL]('limit-y')) || null,
scalarX: parseFloat(this.$[login to view URL]('scalar-x')) || null,
scalarY: parseFloat(this.$[login to view URL]('scalar-y')) || null,
frictionX: parseFloat(this.$[login to view URL]('friction-x')) || null,
frictionY: parseFloat(this.$[login to view URL]('friction-y')) || null,
originX: parseFloat(this.$[login to view URL]('origin-x')) || null,
originY: parseFloat(this.$[login to view URL]('origin-y')) || null
};
// Delete Null Data Values
for (var key in data) {
if (data[key] === null) delete data[key];
}
// Compose Settings Object
$.extend(this, DEFAULTS, options, data);
// States
[login to view URL] = null;
[login to view URL] = true;
[login to view URL] = false;
[login to view URL] = [];
[login to view URL] = null;
// Element Bounds
[login to view URL] = null;
[login to view URL] = 0;
[login to view URL] = 0;
[login to view URL] = 0;
[login to view URL] = 0;
// Element Center
[login to view URL] = 0;
[login to view URL] = 0;
// Element Range
[login to view URL] = 0;
[login to view URL] = 0;
// Calibration
[login to view URL] = 0;
[login to view URL] = 0;
// Input
[login to view URL] = 0;
[login to view URL] = 0;
// Motion
[login to view URL] = 0;
[login to view URL] = 0;
// Velocity
[login to view URL] = 0;
[login to view URL] = 0;
// Callbacks
[login to view URL] = [login to view URL](this);
[login to view URL] = [login to view URL](this);
[login to view URL] = [login to view URL](this);
[login to view URL] = [login to view URL](this);
[login to view URL] = [login to view URL](this);
[login to view URL] = [login to view URL](this);
// Initialise
[login to view URL]();
}
Hello,
I understood the initial scope of this project.
Although i want to discuss further this job in order to
prepare the final concept for this project.
After Complete discussion over the call or in chat, i
will prepare following things for you
- Technical Project Proposal
- Flow chart for this Project
- Execution plan (Step by step procedure with explanation how and at what that we are going to execute a particular task)
Hey, feeling interest to go with the project after checking your requirements. My speciality: I STRICTLY BITE IF AND ONLY IF I CAN CHEW. Let's discuss more when u knock