prettyPhoto jquery plugin doesn't work

Question

I am using the prettyPhoto jquery plugin to show a gallery of pictures on my page, and it doesn't work for some reason. I am trying this on my localhost and I use Zend Framework.

This is my code:

<script type="text/javascript" src="<?php echo URLgenerator::getScryptURL('jquery.js'); ?>"></script>
<link rel="stylesheet" href="<?php echo URLgenerator::getStyleURL('prettyPhoto/css/prettyPhoto.css'); ?>" type="text/css" media="screen" charset="utf-8" />
<script src="<?php echo URLgenerator::getScryptURL('prettyPhoto/js/jquery.prettyPhoto.js'); ?>" type="text/javascript" charset="utf-8"></script>

The main part:

<?php 
                    $photos = $project->getPhotos();
                    foreach($photos as $photo):
                ?>
                        <a href="<?php echo $photo->getPhotoURL(); ?>" rel='prettyPhoto[pp_gal]'>
                            <img src="<?php echo $photo->getPhotoURL(); ?>" alt="" class="ProjectPageImage" />
                        </a>
                <?php 
                    endforeach;
                ?>

at the end of the page:

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

What I get is a weird sort of gallery appended at the end of the page under everything, and not the "lightbox" popup I should get.

Answer 1

Since you mention that the markup is being added, but is not displaying the way you expect it to be. Then you should check the CSS file is loaded, because it seems like the styling is not applied to the elements.