Ahora viene el siguiente problema que me surge, haver si alguien se anima esta vez, y me ayuda un poco, que sino paso mas tiempo que nadie para hacer una tonteria.
Al ver que este lightbox no adaptava el tamaño de una imagen al tamaño de documento siendo el tamaño real de la imagen el más grande, he cambiado de lightbox.
Ahora uso el fancybox, y en este no se como ponerle la misma función.
Parece que funcionan igual o muy parecido, pero al darle el href="#" se pierde y no me encuentra el link, y mucho menos los tamaños. Vaya que etoy como al principio.
Hos pongo aqui el codigo del fancybox, haver si alguien ve el error que he cometido, o la forma de integrarlo todo ya que no se si será por la etructura, o que coge las medidas diferente, o la funcion... no se.
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="imagetoolbar" content="no" />
<title>FancyBox 1.3.4 | Demonstration</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
!window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>');
</script>
<script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<link rel="stylesheet" href="style.css" />
<script type="text/javascript">
$(document).ready(function() {
/*
* Examples - images
*/
$("a#example1").fancybox();
$("a#example2").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'titlePosition' : 'inside'
});
$("a#example3").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("a#example4").fancybox({
'opacity' : true,
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'none'
});
$("a#example5").fancybox();
$("a#example6").fancybox({
'titlePosition' : 'outside',
'overlayColor' : '#000',
'overlayOpacity' : 0.9
});
$("a#example7").fancybox({
'titlePosition' : 'inside'
});
$("a#example8").fancybox({
'titlePosition' : 'over'
});
$("a[rel=example_group]").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'titlePosition' : 'inside',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span>' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}
});
/*
* Examples - various
*/
$("#various1").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("#various2").fancybox();
$("#various3").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
$("#various4").fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none'
});
});
</script>
<script>
function clickhoriz(shref,iwidth,iheight){
//size=getWidthHeight(this.id);
if($(window).width()>1080){
$(".anim").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
href : shref,
innerWidth : (iwidth*2)+"px",
innerHeight : (iheight*2)+"px",
'type' : 'iframe'
'titlePosition' : 'inside'
});
}
if($(window).width()<=1080 && $(window).width()>800){
$(".anim").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
href : shref,
innerWidth : (iwidth*1.5)+"px",
innerHeight : (iheight*1.5)+"px",
'type' : 'iframe'
'titlePosition' : 'inside'
});
}
if($(window).width()<=800){
$(".anim").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
href : shref,
innerWidth : (iwidth)+"px",
innerHeight : (iheight)+"px",
'type' : 'iframe'
'titlePosition' : 'inside'
});
}
}
</script>
</head>
<body>
<div id="content">
<h1>fancybox <span>v1.3.4</span></h1>
<p>This is a demonstration. <a href="http://fancybox.net">Home page</a></p>
<hr />
<p><a href="#" class='anim' rel="example_group" onclick="clickhoriz('img/gulfs.html',687,475);">prova – GULFS</a></p> No se si no lo pilla porque innerHeight no lo lee pero no se .
Lo he puesto con comillas, sin comillas, con class, con id, vaya que és como si la función no existiera y después de 2 dias intentandolo ya no se que más hacer.