This likely has something to do with it:
In my browser console I see the following error:
Code: Select all
Uncaught ReferenceError: $ is not defined
Which means that the jQuery library is not loaded yet...
When you are loading the library you have specified a "defer" attribute in the tag:
Code: Select all
<__script__ src="https://modh.co.za/uploads/js/epilogue.jquery.min.js" defer></__script>
The "defer" above specifies that the jquery library will not run until after the page has finished loading. But it should run
before the page finishes loading.
Try removing "defer" from that script tag and see what happens. I bet that will fix the problem.
EDIT: Just did a quick test and ran this code in my browser console after the page finished loading:
Code: Select all
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto({
animation_speed: 'fast',
slideshow: 5000,
autoplay_slideshow: false,
show_title: true,
allow_resize: true,
counter_separator_label: '/',
theme: 'dark_rounded', /* light_rounded / pp_default / light_square / dark_square / facebook */
hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto*/
overlay_gallery: true,
keyboard_shortcuts: true
});
});
...as soon as I did that, pretty photo started working. So the issue is exactly what I stated above: The jQuery library is not loaded at the appropriate time... removing "defer" will fix it.
I'm looking at you @velden and @rolf (to name but 2)