July 2009 – dom.hastin.gs

Thu 30th Jul 2009Sun 18th Mar 2012

jQuery Parallax 0.2 – Minor updates

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
          }
        }
      }
    }
  ]
});

$('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.

Tue 28th Jul 2009Thu 30th Jul 2009

JSS 0.2 – Nested CSS update

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 “JSS 0.2 – Nested CSS update”

Tue 28th Jul 2009

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

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).

Sat 11th Jul 2009Thu 30th Jul 2009

Parallax 0.1 – Simple parallax effect for jQuery

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.

Fri 10th Jul 2009Tue 4th Aug 2009

chunk – Read a large (XML) file a chunk at a time

I’ve recently had to parse some pretty large XML documents, and needed a method to read one element at a time.

Here’s a fairly simple solution in PHP and Ruby form (hopefully a Python one coming soon…).

Continue reading “chunk – Read a large (XML) file a chunk at a time”