More on Comparing Photos

Here's another photo comparison technique. It's much less common than others you've seen. It approaches the cutting edge in terms of web development code.
Here’s another photo comparison technique. It’s much less common than others you’ve seen. It approaches the cutting edge in terms of web development code and won’t work if your browser doesn’t have a relatively recent release installed.


A work in progress
Drag this slider in the image below to view the comparison
If you drag elsewhere, the image may turn blue 🙁
Just refresh the screen if that happens
2nd problem to be solved is that the overlapping images don’t align vertically



_DSC4327_nx sep2


Please let me know if today’s technique fails to change the image on your browser. The cause may be that your browser needs updating or that I made an error in the code. Yesterday’s image comparisons suffered from both of these problems for two Safari browser users. One browser was several releases out date and doesn’t support the custom code. The other was current but I left out the special code needed to make that version work.

Older versions of Internet Explorer (pre-IE v.10) are notorious for failure to abide by international standards. Even the latest version is not implemented to support the newest (around for several years!) web features. Folks, there’s not enough space here to list all of the reasons (security, standards conformance, performance…) why I strongly advise using Chrome or Firefox – or almost anything but IE. And – if you insist on IE but don’t update it regularly (including the weekly Microsoft patch updates) you’re doing yourself a disfavor.

Also, do not use Safari on a Windows PC. Apple stopped supporting it in 2012.

Subscribe (see sidebar) and don’t miss anything. New posts daily.

  • No sidebar? Click here or the blog title at the top of this page.

0 thoughts on “More on Comparing Photos”

  1. Neither mobile Safari nor Chrome for iOS seem to work. For all those reasons I gave up doing fancy code on my web pages a long time ago; took me way longer to test with all browser variants and make it compatible than coding it…

    • Right now I’m exploring the practicality & limits – as you seem to have already done. To avoid the long test times I’m now using “Can I Use?”. If you take a look at it and check the CSS resize property, you’ll see that it confirms what you discovered related to mobile. I’ve also automated the process to include browser vendor code prefixes needed to make some CSS properties work on specific browsers (not getting these right – manually – was the cause of the problems on the first post).

      Just the latest in a life-long learning experience to keep the old (78 next month) gray-matter working.

Subscribe to this blog and receive notifications of new posts by email.