This
$('a#inline').fancybox();
... doesn't trigger fancybox, it just binds the selector #inline
to fancybox but you still need to click
on that selector to fire it; so if you do this
$('#inline').click(function(){
$('a#inline').fancybox();
});
... the first click
only allows fancybox to be bound to #inline
and only the second click
will trigger it.
What you could do is :
$(document).ready(function () {
$('#inline').click(function () {
alert("Hi");
html2canvas($('#testdiv'), {
onrendered: function (canvas) {
var img = canvas.toDataURL("image/png");
$('#image').attr('src', img).fadeIn(200);
}
});
}).fancybox();
});