Show HN: Combining AJAX, pushState & CSS3 transitions | Hacker News Reader

Show HN: Combining AJAX, pushState & CSS3 transitions

paynedigital.com

23 pointspaynedigital8 comments

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.

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

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.

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.

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

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.

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

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.

Reply on news.ycombinator.com