.: how to change lazy load gray background block
Lazy load is a JQuery plugin that delays loading of images in long web pages. Images outside of viewport (visible part of web page) wont be loaded before user scrolls to them (this is opposite of image preloading!).
The effect is nice: a fade-in from a gray block the same size of the image that is being loaded.
But many times i wondered how to change that colour. A brief look to the code reveals that usually there is a .gif placeholder (a 1pixel x 1 pixel image that contains a solid color) used in a code like this (the code refers to a Wordpress plugin):
function jquery_lazy_load_ready() {
$placeholdergif = plugins_url('images/grey.gif', __FILE__);
echo <<<EOF
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").not(".cycle img").lazyload({
effect:"fadeIn",
placeholder: "$placeholdergif"
});
});
So simply edit that damn image in Photoshop and set your favourite color... et voilà.
|