Monthly Archives: July 2009

jQuery Parallax 0.2 – Minor updates

Posted on by
22

So I’ve updated the parallax script a little. It’s called in a more jQuery like manner now and has a couple of useful options for inverting the movement and changing the unit of measurement to any jQuery/CSS supported unit.

Example code:

$('div.parallax').parallax({
  'elements': [
    {
      'selector': 'body',
      'properties': {
        'x': {
          'background-position-x': {
            'initial': 0,
            'multiplier': 0.1,
            'invert': true
          }
        }
      }
    },
    {
      'selector': 'div.outer',
      'properties': {
        'x': {
          'background-position-x': {
            'initial': 50,
            'multiplier': 0.02,
            'unit': '%'
          }
        }
      }
    },
    {
      'selector': 'div.inner',
      'properties': {
        'x': {
          'background-position-x': {
            'initial': 0,
            'multiplier': 0.3
          }
        }
      }
    }
  ]
});

You can see a demo of the updated script, or just download the package (includes jQuery 1.3.2).

Edit: I’ve added a post with a couple of working examples here.

JSS 0.2 – Nested CSS update

Posted on by
1

So I thought I’d update the JSS script I wrote previously with a few changes I’ve been thinking about for a while.

The primary reason for the update is to add a new ‘non-CSS’ property of ‘include’. This property allows you to include styles that have already been defined in the current class. Continue reading →

Trackr 0.1 – jQuery based user interaction tracking (PHP/MySQL)

Posted on by
7

Trackr is a very simple, lightweight (well, if you’re already using jQuery) user interaction tracker. It’s not particularly robust and is only in a fairly simple form right now.

The back end is written in PHP using MySQL for storage, but could easily be implemented in other languages.

To log data, you simply add a call to Trackr.init() to the page load event, passing the desired options as the only parameter to the function.

There are a variety of options that can be specified and for more information please see the test page.

You can get it here (includes jQuery 1.3.2).

Parallax 0.1 – Simple parallax effect for jQuery

Posted on by
Reply

I’ve seen some very cool parallax effect around lately, especially liking the Silverback site. But none of them are particularly interactive, so I thought I’d make a small implementation of the Parallax effect that interacts with the mouse.

Very early stages (and I haven’t tested it on IE yet… but you could just you conditional comments to exclude ‘those’ people anyway…) but it seems to be working ok. The options aren’t really simple, but they should be fairly self-explanatory…

Check out the demo (it is a very poor demo, please don’t look at the images, imagine it with a lovely hand drawn vector!) and get it here (minified).

Update: Created a quick demo of the silverback homepage with interactive parallax.

Update 2: Tested on IE8, seems to work fine!

Update 3: I have modified the script slightly, you can view the post here.