search

MatteoGabriele / vue-progressive-image

Vue progressive image loading plugin
https://matteo-gabriele.gitbook.io/vue-progressive-image/
MIT License
721 stars 43 forks source link

Blur on Progressive background also #55

Closed GeorgeChackungal closed 6 years ago

GeorgeChackungal commented 6 years ago

First and foremost nice job with the library. I was wondering if its possible to add the blur to the original image as well or if you could suggest a way to do it dynamically.

Thanks!

MatteoGabriele commented 6 years ago

Hey @GeorgeChackungal thanks for the feedback :) it's currently not possible, but if if you add the placeholder attribute and you pass the same source that you add in the src attribute, you should be able to achieve a face effect.

<progressive-img
  src="main_image_path"
  placeholder="main_image_path">
</progressive-img>

The fade will be quite fast because the file has been already downloaded by the placeholder so transition will be much faster. If you want to force a slower transition you can adjust the delay value in the global settings of the plugin.

Best option will be to really have a 3kb version of the same image to load as placeholder and let the plugin handle the main big file.

let me know if works for you.

Thanks