jQuery

【jQuery】画像ロードされた時にぼかし効果Blurry Image Load

January 1, 2017
Blurry Image Load

Blurry Image Loadは画像が完全にロードされた時にぼかし効果提供するjQueryのプラグインです。

CSS

<link rel="stylesheet" href="blurry.load.css">

HTML

<img class="image-blur" src="https://cdn-images-1.medium.com/freeze/max/27/1*sg-uLNm73whmdOgKlrQdZA.jpeg?q=20" data-large="https://cdn-images-1.medium.com/max/1800/1*sg-uLNm73whmdOgKlrQdZA.jpeg">

JS

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="blurry.load.js"></script>
<script>
$('.image-blur').blurryLoad()
</script>