Search code examples
javascriptjqueryhtmllazy-loading

Lazy Loading doesnt display my images

I have heavy content images. Thats why I decided to use lazy load: http://www.appelsiini.net/projects/lazyload

My page is this one: http://www.mysecretathens.gr/kulte_test/osterman.html

I followed all the instructions that are required but dont understand why the first images that I wanted to test the lazy load function dont display

In my head section is this:

   <script src="jquery.js" type="text/javascript"></script>
<script src="lazyload.js" type="text/javascript"></script>

the images:

 <img class="lazy" src="grey.gif" data-original="osterman/ost21.jpg" width="900" height="602" >

and JS code 

  <script type="text/javascript">

 $("img.lazy").lazyload();

</script>

Why is only the grey.gif showing up and not the actual image? Any ideas? Do I have the wrong jquery files? Thanks in advance

Solution

  • Errors in chrome debugger:

    Uncaught SyntaxError: Unexpected identifier jquery.js:9598

    Uncaught SyntaxError: Unexpected identifier lazyload.js:228

    Uncaught ReferenceError: $ is not defined osterman.html:205