I’ve been doing some more simple experiments with SVG animation using GSAP, and amended my chicken-in-a-fokker scene on Codepen that I wrote about in the last article. Continue reading Added interactivity to my SVG animation
I worked on a new website recently that uses a subtle parallax scroll effect on the homepage, so I wanted to briefly explain how the effect was achieved. Continue reading Subtle parallax effect on scroll – client website
I used a mixture of animation types, including GSAP and CSS animation. I was doing some investigation into how much memory is required to run these animations (because it made my laptop’s fan come on all the time!) and found that the way I was animating the clouds in the background really wasn’t efficient. Continue reading Optimising my clouds CSS animation
I’ve created an animation using a few different methods that runs in a browser and is responsive (works on both mobiles, tablets and desktop). Continue reading Creating animation with SVGs, CSS animations, spritesheets & GSAP
I normally create my vector graphics in Adobe Animate, just because since University (back when it was called Flash) it’s what I’ve used the most, even though I know Illustrator is the more popular tool for vector graphics. Continue reading The difference between expoting SVG from Adobe animate and Illustrator
I’ve just been stuck on a problem for ages, and that’s to keep at a specific aspect ratio (on mobile, tablet and desktop), but also to allow it to expand if there’s more content inside it. Continue reading Forcing a div to retain aspect ratio, but also expand if there’s more content
I just added some new breakpoints to Foundation 6’s new XY grid, and found it surprisingly simple. Continue reading Adding new breakpoints to Foundation’s XY grid
We’ve had this discussion at work a while back and there’s different trains of thought for whether you should commit your generated CSS file (if you’re compiling it from SASS/SCSS/LESS etc). Continue reading Should generated CSS be included in a repo? – I say yes
I’m a web developer learning Unity. I’ve made a few games now, but I still find working with Unity totally different to working with web. Here’s what I’ve discovered so far: Continue reading Things I discovered about Unity as a web developer
I use Browserstack a lot for testing website in devices, and It’s especially useful as I don’t have a lot of popular devices that I need to test on. iPhone 5, iPhone 6, iPad, iPad air etc.
I noticed a problem a few times now, and it’s mostly the way these iOS devices handle vendor prefixes – or more specifically that they *require* vendor prefixes for things like transform: rotate();
Sometimes, a page might look totally different on Browserstack (which shows the design messing up disastrously) to on iPhones and iPads that I’ve tested on.
It seemed a bit odd to me that the most favoured devices in the world still required vendor prefixes, when Chrome mostly doesn’t need them. I assumed they must have been updated recently surely, and that Browserstack is only showing me the devices at their factory settings. So I asked them to find out.
So there’s proof. Devices on Browserstack are at their factory settings, which means any updates to the browser (and there might have been loads by now, surely?) won’t show.
This is good and bad, I can see why you’d want to see what your website looks like on a brand new out-of-the-box iPhone, but also, with the amount of browser updates there’s been, that might display totally different to the majority of iPhones.
But, just something to bear in mind.
Update – Browserstack got back to me saying they do provide the latest version of Safari on iPhone 6S and 6S Plus, which is what I’d expect.
Although still it looks like you can’t test on an older phone that’s upgraded to Safari 9 (assuming that does happen of course?!).