Skip to content


Subversion checkout URL

You can clone with
Download ZIP
69 lines (66 sloc) 1.82 KB
<!DOCTYPE html>
<title>Plax Example</title>
<script type="text/javascript" src=""></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;
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;
<script type="text/javascript">
$(document).ready(function () {
$('#shell img').plaxify()
<div id="shell">
<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"/>
Jump to Line
Something went wrong with that request. Please try again.