Permalink
Browse files

change docWidth -> plaxTargetWidth

  • Loading branch information...
1 parent 487f878 commit 7c6918314036e57dfb7c993773ab039dc4475a41 Cameron McEfee committed Jan 13, 2012
Showing with 78 additions and 6 deletions.
  1. +72 −0 examples/specific-element.html
  2. +6 −6 js/plax.js
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Plax Example</title>
+ <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
+ <!-- <script src="http://s3.amazonaws.com/ender-js/jeesh.min.js"></script> -->
+
+ <script type="text/javascript" src="../js/plax.js"></script>
+ <style type="text/css">
+ * {
+ margin: 0px;
+ padding: 0px;
+ }
+ body {
+ background: #ebeae6 url(img/body_bg.png) top left repeat;
+ position: relative;
+ }
+ div#shell {
+ display: block;
+ position: relative;
+ margin: 100px auto;
+ width: 318px;
+ height: 318px;
+ }
+ div#shell.outline{
+ border: 1px solid #cccbc8;
+ }
+ div#shell{
+ z-index: 1;
+ }
+ img#plax-logo {
+ position: absolute;
+ top: 125px;
+ left: 90px;
+ z-index: 3;
+ }
+ img#plax-sphere-1 {
+ position: absolute;
+ z-index: 4;
+ top: 189px;
+ left: 191px;
+ }
+ img#plax-sphere-2 {
+ position: absolute;
+ z-index: 2;
+ top: 49px;
+ left: 53px;
+ }
+ img#plax-sphere-3 {
+ position: absolute;
+ top: 35px;
+ left: 32px;
+ z-index: 1;
+ }
+ </style>
+ <script type="text/javascript">
+ $(document).ready(function () {
+ $('#shell img').plaxify()
+ $.plax.enable()
+ })
+ </script>
+
+ </head>
+ <body>
+ <div id="shell" class="outline">
+ <img src="img/plax_logo.png" width="136" height="70" data-xrange="20" data-yrange="20" id="plax-logo"/>
+ <img src="img/plax_sphere_small.png" width="93" height="92" data-xrange="40" data-yrange="40" id="plax-sphere-1"/>
+ <img src="img/plax_sphere_large.png" width="215" height="215" data-xrange="10" data-yrange="10" id="plax-sphere-2"/>
+ <img src="img/plax_sphere_small.png" width="93" height="92" data-xrange="40" data-yrange="40" data-invert="true" id="plax-sphere-3"/>
+ </div>
+ </body>
+</html>
View
@@ -29,8 +29,8 @@
delay = 1 / maxfps * 1000,
lastRender = new Date().getTime(),
layers = [],
- docWidth = $(window).width(),
- docHeight = $(window).height(),
+ plaxTargetWidth = $(window).width(),
+ plaxTargetHeight = $(window).height(),
motionEnabled = false,
motionMax = 1,
motionAllowance = .05,
@@ -43,8 +43,8 @@
}
$(window).resize(function() {
- docWidth = $(window).width()
- docHeight = $(window).height()
+ plaxTargetWidth = $(window).width()
+ plaxTargetHeight = $(window).height()
})
// Public Methods
@@ -239,8 +239,8 @@
}
- var hRatio = x/((motionEnabled == true) ? motionMax : docWidth),
- vRatio = y/((motionEnabled == true) ? motionMax : docHeight),
+ var hRatio = x/((motionEnabled == true) ? motionMax : plaxTargetWidth),
+ vRatio = y/((motionEnabled == true) ? motionMax : plaxTargetHeight),
layer, i
for (i = layers.length; i--;) {

0 comments on commit 7c69183

Please sign in to comment.