prettyPhoto not working, no errors in console
Asked Answered
F

2

5

Here is the code in my <head>:

<!-- Pretty Photo -->
<link rel="stylesheet" href="/css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet" charset="utf-8" />
<script src="/js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

Here is the image I am trying to load into the viewer.

<div class="altImage">
    <a href="http://scoutsamerica.com/uploads/485604_10201093620571706_1239548317_n_716437.jpg" rel="prettyPhoto">
        <img src="http://scoutsamerica.com/uploads/485604_10201093620571706_1239548317_n_716437.jpg">
    </a>
</div>

I've dont this dozens of times and cant figure out why its not working. Any ideas?

Flaggy answered 27/5, 2013 at 21:50 Comment(1)
I haven't used this plugin, but dont you have to instantiate it somewhere? Like $("img").prettyPhoto();Anthologize
A
6

Per the documentation:

<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
    $("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>

Source: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/prettyphoto-faqs/

You will also need to import the standard jQuery library to use jQuery plugins!

Anthologize answered 27/5, 2013 at 21:55 Comment(1)
Oh, Hmm, I was looking at the demo source they were giving, I didn't see that in there. Thanks!Flaggy
S
1

The answer by tymeJV was helpful, but still did not work. This did, however:

<script type="text/javascript" charset="utf-8">
jQuery.noConflict();
jQuery( document ).ready(function( $ ) {
    $("a[rel^='prettyPhoto']").prettyPhoto();
});

</script>
Simian answered 18/6, 2015 at 9:57 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.