
Show HN: Amplify – A tiny script allowing inline image zoom - CharlesTati
https://github.com/charlestati/amplify
======
maxpert
Shameless plug ~7 years ago when canvas was still a new thing I did a weird
take on this zooming concept
[http://maxpert.github.io/wadda/](http://maxpert.github.io/wadda/)

------
Gys
The demo link does not work for me on Firefox 55.0.3 on OSX 10.12.6

Works in Chrome, Safari and Opera.

~~~
Liquidor
Apparently the author of the project didn't fully implement flexbox
properties, making it not work in IE/Firefox.

Reported the issue and suggested a fix:
[https://github.com/charlestati/amplify/issues/2](https://github.com/charlestati/amplify/issues/2)

------
csciutto
It might just be that I don't have much experience with JS, but it profoundly
annoys be that a "tiny" script has 8 additional config files...

~~~
Liquidor
The configuration files are just for working on the source. The final file
looks like this:
[https://github.com/charlestati/amplify/blob/master/docs/ampl...](https://github.com/charlestati/amplify/blob/master/docs/amplify.min.js)

------
spiderfarmer
One of the reasons I like lightboxes is because it doesn't trigger a content
reflow. This does, which is an issue on slow mobile devices.

------
nishs
Similar with potentially smoother UX:

\- [https://github.com/fat/zoom.js/](https://github.com/fat/zoom.js/) (jQuery)

\-
[https://github.com/nishanths/zoom.js/](https://github.com/nishanths/zoom.js/)
(fork with no dependencies)

~~~
ComputerGuru
I don’t think so? Those are closer to lightboxes, they’re not really that
“inline”

------
tgb
There's a related annoyance I've had for a while now: I grew up reading PC
Gamer magazine and one of the great things about it was, for me, seeing the
fancy new graphics coming out in large, glossy screenshots. Now, I read Rock
Paper Shotgun and PC Gamer online and the screenshots are tiny, tiny things!
On screenshot-focused articles, they'll be expandable but on most they're just
little blocks the size of the textbox I'm writing in right now. And even when
they are expandable, they almost never actually let you expand to full-screen.
It kills some of the fun for me - but I guess now we have fullscreen video to
more than make up for it though I don't always want to watch a video.

While expanding them inline would be nice, it doesn't really fix the problem
that they're serving tiny images.

------
purrcat259
Missed opportunity to call it Enhance! :)

~~~
Pigo
I was wondering, because there is an Amplify library already, but I think it
goes by AmplifyJS.

------
zichy
Thumbnail and srcset support would be nice.

------
dehef
how do you can use it in angular (2)?

~~~
blauditore
The functionality is simple and mostly based on CSS, so just set relevant
attributes in your template and toggle 'aria-expanded' on click as in the JS
file[1]. Then, include (S)CSS copy which handles resizing based on above
attribute[2].

All files other than those in src/ are just processing fluff and irrelevant
for the actual functionality.

[1]:
[https://github.com/charlestati/amplify/blob/master/src/ampli...](https://github.com/charlestati/amplify/blob/master/src/amplify.js)
[2]:
[https://github.com/charlestati/amplify/blob/master/src/ampli...](https://github.com/charlestati/amplify/blob/master/src/amplify.scss)

