The project text appears duplicated and the header when an image is clicked. However, the 'Back to Portfolio' button and header buttons do not seem to work.
Even if you return to the 'Portfolio' page, the project text continues to appear.
html
<li style="height:393px;" data-src="http://www.janinejauvel.com/wp-content/uploads/2012/09/editorial-1-rwd-magazine.png">
<span class="cover" style="width:308px;height:0px;background-image:url('http://www.janinejauvel.com/wp-content/uploads/2012/09/bg-white.png')"></span>
<hgroup style="width:308px;height:393px;background-image:url('http://www.janinejauvel.com/wp-content/uploads/2012/09/bg-white.png')" data-project="test/dirty-fashion">
<div>
<h3>Editorial I</h3>
<span class="dash">—</span>
<p>RWD Magazine</p>
</div>
</hgroup>
</li>
script.js
// Once the project is loaded into the slideshow container div
$('#slideshow-container').load('' + $hgroup.attr('data-project'), function() {
// bind slideshow
slideshow.render();
$('section#work').css('margin-top', '0px');
});
});
$(document).ready(function() {
hattie.init();
hattie.clickEvents();
hattie.loadImages();
});
$(window).resize(function() {
// get the currently active project, if there is one
if ($('#slideshow').length > 0) {
var activeProject = $('#slideshow').attr('class');
// trigger click
$('hgroup[data-project="'+ activeProject + '"]').trigger('click');
}
});