I´m trying to make Fancybox2 works on Ipad. Im using all the documentation posted in this website http://fancyapps.com/fancybox/. My code works right on Browsers even on iBooks if it is running on a Laptop but it doesnt work correctly on iPad/iPhone. Im trying to display an image in FULL-SCREEN when you tap on it but it doesnt show anything. When you tap on the image it opens a new blank and white window with the Buttom "Done" to close it but without the image.
this is the head of the .xhtml documet from Indesign.
<?xml version="1.0" encoding="UTF-8" standalone="no" ?><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head>
<meta charset="utf-8"/>
<meta content="width=553,height=723" name="viewport"/>
<title>001NEGRA-3</title>
<script src="../Misc/jquery-1.10.1.min.js" type="text/javascript"/>
<link rel="stylesheet" href="../Styles/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="../Misc/jquery.fancybox.pack.js?v=2.1.5"></script>
<script type="text/javascript" src="../Misc/jquery.fancybox.js"></script>
<link href="../Styles/idGeneratedStyles.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
</head>
And this is the line of the image:
<a class="fancybox" href="../Images/fig01_003.png">
<img alt="" class="_idGenPageitem-2 _idGenPageitem-3" src="../Images/fig01_003.png"/>
</a>
Many thanks!! If It is not possible doing with fancybox, does anybody know another way to do it?.
I Fixed this with touchend Event