Ver Mensaje Individual
  #5 (permalink)  
Antiguo 20/12/2011, 14:10
Avatar de paxarin
paxarin
 
Fecha de Ingreso: enero-2010
Ubicación: Santander
Mensajes: 413
Antigüedad: 14 años, 4 meses
Puntos: 6
Respuesta: Problemilla en la colocación de unas imagenes en un div

haber si yo cojo es script y lo pongo en un html solo osea un div solo dentro del body, tal y como estaba al principio funciona correctamente y va cambiando las imagenes correctamente.
Pero al pasarlo al html de la web ya la cosa no va, vamos no cambia dentro del div.
Debe de cambiar las dos imagenes tanto la que puse como "pri" como la siguiente que no tiene ningun id, por este motivo fue por que puse el nombre del div que contiene las imagenes y al que debe de afectar el css.
Mira el codigo completo de la pagina es este.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="pub.css" />
<!-- include CSS always before including js -->
<link type="text/css" rel="stylesheet" href="galer/skins/tn3/tn3.css"></link>
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#wrapper").fadeOut(0,function(){ $(this).fadeIn(20000); });


});
</script>
<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<!-- include tn3 plugin -->
<script type="text/javascript" src="galer/js/jquery.tn3lite.min.js"></script>
<!-- initialize the TN3 when the DOM is ready -->
<script type="text/javascript">
$(document).ready(function() {
//Thumbnailer.config.shaderOpacity = 1;
var tn1 = $('.mygallery').tn3({
skinDir:"skins",
imageClick:"fullscreen",
image:{
maxZoom:1.5,
crop:true,
clickEvent:"dblclick",
transitions:[{
type:"blinds"
},{
type:"grid"
},{
type:"grid",
duration:460,
easing:"easeInQuad",
gridX:1,
gridY:8,
// flat, diagonal, circle, random
sort:"random",
sortReverse:false,
diagonalStart:"bl",
// fade, scale
method:"scale",
partDuration:360,
partEasing:"easeOutSine",
partDirection:"left"
}]
}
});
});
</script>
<script language="javascript">
function abrirVentana1()
{
window.open('emerg/uno.html','','titlebars=0, toolbar=0,scrollbars=0,location=0,directories=0,st atusbar=0,menubar=0,resizable=0,width=400,height=4 00,top=100,left=100');
}
function abrirVentana2()
{
window.open('emerg/dos.html','','titlebars=0, toolbar=0,scrollbars=0,location=0,directories=0,st atusbar=0,menubar=0,resizable=0,width=400,height=4 00,top=100,left=100');
}
</script>
<script>
<!--
// Cargamos al principio las imágenes
var imgNum=0;
var totalImagenes=2;
imagenes=new Array();
for ( i=0; i<totalImagenes; i++ ) {
imagenes[i]=new Image();
imagenes[i].src="foto/imagen"+i+".jpg"
} // for

// Esta es la funcion que cambia los graficos
function graficosAnimados() {
document.getElementById("dest").src=imagenes[imgNum].src;
if( imgNum<totalImagenes-1 ) {
imgNum++;
} else {
imgNum=0;
}
setTimeout( "graficosAnimados();",4000);
} // function graficosAnimados
// -->
</script>

</head>

<body onLoad="graficosAnimados();">

<div id="wrapper">
<h1>Osiris - Vinacoteca PUB - La cava</h1>
<div id="header">
<img src="img/osiris.png" width="217" height="73" id="uno" />
<img src="img/vino.png" width="215" height="73" id="dos" />
<div id="logo">
</div>
<div id="nav">
<ul class="navigation">
<li class="activa"><a href="" title="Inicio"><em class="home"></em>Inicio</a></li>
<li><a href="cava.html" title="Nuestros caldos"><em class="cava"></em>La Cava</a></li>
<li><a href="" title="Folixia"><em class="party"></em>Fiestas</a></li>
<li><a href="galer2/gale.html" title="Álbum de fotos"><em class="galer"></em>Galeria</a></li>
<li><a href="cono.html" title="Conocenos"><em class="cono"></em>Conocenos</a></li>
<li><a href="contac.html" title="Contacto"><em class="contact"></em>Contacto</a></li>
</ul>
</div>
</div>
<div id="cont1">
<div id="slider">

</div>
<div id="dest">
<!--<img src="img/publi_futbol.jpg" width="300" height="400" alt="" id="" />-->
<img src="foto/imagen0.jpg" id="pri">
<img src="foto/imagen1.jpg">
</div>
<div id="estas">
<h3>Estás aquí:</h3>
<ul>
<li><a href="index.html">Inicio</a></li>
</ul>
</div>
</div>
<div id="cont2">
<div id="menu">
<ul>
<li><a href="inicio.html" title="Inicio"></em>Inicio</a></li>
<li><a href="cava.html" title="Nuestros caldos">La Cava</a></li>
<li><a href="" title="Folixia">Fiestas</a></li>
<li><a href="galer2/gale.html" title="Álbum de fotos"></em>Galeria</a></li>
<li><a href="cono.html" title="Conocenos"></em>Conocenos</a></li>
<li><a href="contac.html" title="Contacto">Contacto</a></li>
</ul>
</div>
<div id="cont_box">
<div class="box">
<img src="img/box_futbol.jpg" width="262" height="172" alt="Partidos de futbol" id="futbol" />
<p class="titu"> Partidos de la semana</p>
<p>Real sporting de gijón Vs. Real Mallorca</p>
<p>Sabado 24 de diciembre ( sin confirmar horario)</p>
<p class="mas"><a href="javascript:abrirVentana1()" title="">Leer más...</a></p>
</div>
<div class="box">
<img src="img/evento_navidad.jpg" width="262" height="172" alt="Partidos de futbol" id="futbol" />
<p class="titu"> Fiesta de navidad</p>
<p>Celebramos contigo la Navidad</p>
<p>Sabado 24 de diciembre a las 00:00 h</p>
<p class="mas"><a href="javascript:abrirVentana2()" title="">Leer más...</a></p>
</div>
<div class="box">
<img src="img/box_futbol.jpg" width="262" height="172" alt="Partidos de futbol" id="futbol" />
<p class="titu"> Partidos de la semana</p>
<p>Real sporting de gijón Vs. Real Madrid</p>
<p>Sabado 2 de diciembre a las 20:00 h</p>
<p class="mas"><a href="" title="">Leer más...</a></p>
</div>
<div class="box">
<img src="img/inaguración.jpg" width="262" height="172" alt="Partidos de futbol" id="futbol" />
<p class="titu"> Fiesta Inaguración</p>
<p>No te la puedes perder</p>
<p>Jueves 1 de diciembre a las 19:30 h</p>
<p class="mas"><a href="" title="">Leer más...</a></p>
</div>
</div>

<div id="red">
<div id="textred">
<p>Vinacoteca PUB OSIRIS ya esta en Facebook y Twitter, donde podrás comprobar los próximos eventos, ver fotos (¡puede que salgas en ellas!) y beneficiarte de ofertas exclusivas para nuestros seguidores en las redes sociales. ¡Únete a nosotros!</p>

</div>
<a href="http://www.facebook.com/profile.php?id=100003207368216" title="Siguenos en FaceBook"><img src="img/facebook.jpg" width="257" height="80" alt="Siguenos en FaceBook" id="face" /></a>
<a href="" title="Siguenos en Twiter"><img src="img/twitter.jpg" width="254" height="" alt="Siguenos en Twiter" id="twi" /></a>
</div>
</div>
</div>
</body>
</html>

Una cosa que no entiendo.
Por que motivo funciona cuando esta el script asi
function graficosAnimados() {
document.images[0].src=imagenes[imgNum].src;
if( imgNum<totalImagenes-1 ) {
imgNum++;
} else {
imgNum=0;
}
setTimeout( "graficosAnimados();",4000);
}
que es cuando se carga en el header y no funciona ( o no se ve) cuando lo pongo asi:
function graficosAnimados() {
document.getElementById("dest").src=imagenes[imgNum].src;
if( imgNum<totalImagenes-1 ) {
imgNum++;
} else {
imgNum=0;
}
setTimeout( "graficosAnimados();",4000);
}
__________________
http://www.paxarindesign.es