Show HN: Combining AJAX, pushState & CSS3 transitions

Show HN: Combining AJAX, pushState & CSS3 transitions(paynedigital.com)

23 points by paynedigital 14 years ago | 8 comments

artpop 14 years ago |

All good until your clients want it to behave the same in IE. Then you have to do ten times the work (hash changes, jQuery animations to replace CSS transitions, etc.)

http://www.nma.gov.au/av/portmacquarie/

Still, the end results are sweet.

paynedigital 14 years ago | |

I'd hope a bit of gentle education surrounding the pros (i.e. very few, just a slightly slicker effect) Vs the cons (i.e all those you outlined) would make most clients see that it's not worth the effort, in this instance at least. But yeah - I take your point :)

RandallBrown 14 years ago |

If you're using safari and do the two fingered swipe to go back, this doesn't look too great. It's the one thing I don't really like about the cool slide animation you get when you do that.

alexchamberlain 14 years ago |

Some nice code there. Have you thought about using less to make the css more readable?

For instance, I use a mixin called border-radius, which is replaced by all the vendor-specifics.

paynedigital 14 years ago | |

Hey - I have pondered using less / sass / etc but so far haven't yet had much need (though the repetition required by the theming is perhaps a strong case to start considering it). To be honest, the vast majority of the site's CSS is contained in Twitter's bootstrap framework anyway so up until this point it's not something I'd worried much about :)

alexchamberlain 14 years ago | | |

If you're using bootstrap, it's even better to use less; it includes a load of mixins for things like border-radius etc.

Just @include "bootstrap.less" at the top of your less file, add your rules below and compile just your less file using lessc. Easy.

duncans 14 years ago |

Nice. Any reason you're setting "Cache-Control: max-age=0, no-cache, no-store"? (or that could be the proxy server here)

paynedigital 14 years ago | |

None at all actually, that's just a mahoosive oversight on my part. I've been working on lots of server side caching and server optimisation (e.g. mod_pagespeed) and committed the cardinal sin of ignoring the basics. Thanks for pointing it out - one for the issue tracker.