topical media & game development
lib-jquery-plugin-parallax-parallax.htm / htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>webdev.stephband.info</title>
<link rel="icon" type="image/png" href="http://webdev.stephband.info/images/favicon.png">
<style type="text/css" media="screen, projection">
@import "lib-jquery-plugin-parallax-css-reset.css";
@import "lib-jquery-plugin-parallax-css-typography.css";
@import "lib-jquery-plugin-parallax-css-style-light.css";
#parallax
{position:relative; overflow:hidden; width:60em; height:20em;}
#pullnav
{position: absolute; top:0; left:648px; width:240px; padding-left:18px; padding-right:18px; padding-top:12px; padding-bottom:10px;
background: url('images/bg_pulldown.png') bottom;}
#housing
/*{height:0px;}*/
#contact
{margin-right:0.5em; }
#pullnav a:focus, #pullnav a:hover
{color: #222222; text-decoration: none;}
#pullnav a
{color: #505050;}
#pullnav form textarea
{width:240px; height:80px;}
#pullnav #donate input
{margin: 0 1.2em;}
#pullnav #donate
{display:none;}
#pullnav #message
{display:none;}
#pullnav #message .website
{display:none;}
#pullnav .error
{color: #7d4819;}
</style>
<script type="text/javascript" src="lib-jquery-plugin-parallax-parallax-files-jquery-1.js"></script>
<script type="text/javascript" src="lib-jquery-plugin-parallax-parallax-files-jquery.js"></script>
<script type="text/javascript" src="lib-jquery-plugin-parallax-parallax-files-email.js"></script>
<script type="text/javascript">
<!--
// jQuery.noConflict();
// VAR
var inPullNav = false;
// RUN
var corners = '<img src="images/corner_white_tl.png" class="tl" />'+
'<img src="images/corner_white_tr.png" class="tr" />'+
'<img src="images/corner_white_bl.png" class="bl" />'+
'<img src="images/corner_white_br.png" class="br" />';
jQuery(document).ready(function(){
//jQuery('h1').html('<img src="images/logo_stephband_medcoalblue.png" />');
jQuery('#parallax').jparallax({}).append(corners);
jQuery('#beer').click(function(){
jQuery('#housing').animate({height: "3em"}, 120).children('#donate').show().siblings().hide();
});
jQuery('#contact').click(function(){
jQuery('#housing').animate({height: 140}, 120).children('#message').show().siblings().hide();
});
jQuery('#pullnav input, #pullnav textarea').focus(function(){inPullNav = true;}).blur(function(){inPullNav = false;});
jQuery('#pullnav').hover(function(){}, function(){
if (!inPullNav) {
jQuery('#housing').animate({height: 0}, 500).children().hide();
}
});
jQuery('#contact').hover(
function(){
jQuery('#contact img').attr({src: "images/icon_letter_on.png"});
},
function(){
jQuery('#contact img').attr({src: "images/icon_letter.png"});
}
);
jQuery('#beer').hover(
function(){
jQuery('#beer img').attr({src: "images/icon_beer_on.png"});
},
function(){
jQuery('#beer img').attr({src: "images/icon_beer.png"});
}
);
jQuery('body').click(function(){
//jQuery('#donate').hide();
});
});
//-->
</script>
<!--[if lt IE 7]>
<script type="text/javascript" src="js/jquery.ifixpng.js"></script>
<script type="text/javascript">jQuery(document).ready(function(){ jQuery('img[@src
(C) Æliens
20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.