Necesito ayuda o alguna idea

[Alejandr4]

Hola a todos:
Una vez más acudo a vosotros a ver si podeis ayudarme, os cuento lo que he hecho y luego elproblema, pero quizá no se al mejor foma de hacerlo, así que se admiten ideas para hacerlo de otra forma.

Vereis tengo un pop up que saca la información de un producto en concreto, el pop up tiene el siguiente esquema:

Nombre del producto
Foto grande
Imagenes relacionadas (si las hay)
Cuadro de compra.

El probema es el siguiente: Yo tengo la foto grande y si hay más fotos (fotos relacionadas) apareecen debajo pero en chiquitito (lo carga PHP de otra tabla diferente a la del producto)

Yo quiero que al pinchar en la foto pequeña se viera en grande donde está la foto primera grande. Había pensado hacerlo con capas, del tipo Si hay imagenes relacionadas haz esta capa y vuelve a empezar¿no?

Hasta aquí todo bien, lo he hecho y funciona, el problema es que en el comportamiento tú a la capa le das una id la cual es la misma que el nombre de la foto y un numero de indice (para saber que capa va encima y cual debajo) Entonces a la foto pequeña le dices que cuando hagan click oculte la foto grande y muestre la capa que se ha creado con php pero claro como solo defines una capa que se repite si hay mas imagenes, solo le puedes decir que oculte esa y al hacer click en una tercera foto si se da el caso de que hayan tres, pus no se ve, porque la foto pequeña no tiene dicho que oculte esa capa.
Ay no se si me estoy explicando bien.
Bueno hay alguna forma en php de hacer esto? No sé exactamente que preguntar, necesito ayuda, ideas, soluciones lo que sea menos que me digais que la foto se abara en otra página :P

Muchas garcias

Alejandra

[okram]

-.-

Hola nuevamente Alejandr4. La verdad no me quedo bien claro tu problema, tengo una idea pero no estoy seguro. Podrias aclarar con mas precision que es lo que necesitas?

Yo entendi esto:

-------------------------------

| ESPACIO PARA LA FOTO GRANDE |
-------------------------------
-------- -------- -------- -------- --------
|FOTO 1| |FOTO 2| |FOTO 3| |FOTO 4| |FOTO 5|
-------- -------- -------- -------- --------

Bien lo que te entendi es que deseas que al hacer clic en cadauna de las fotos pequeñas esta se abra automaticamente en el espacio de la foto grande si??? SI es asi, puedes mandar algo del codigo que tengas hecho para poder ayudarte?

Salu2

[Alejandr4]

Pues no me he explicado tan mal como pensaba me has entendido perfectamente, pero como la imagen grande y las otras estan en consultas diferentes había pensado poner una capa encima de la foto grande y que la capa de cada una de las fotos se mostrara cuando le das a la foto pequeña, pero tengo el problema que he explicado antes, que no oculta las otra scapas porque en realidad en html yo solo le digo que oculte una, la unica que defino en el codigo.
Te pego aqui abajo el codigo.
<?
$id=($_GET['id']);
$link = mysql_connect("lldb499.servidoresdns.net","xxx","x xx")
or die ('Lo sentimos, no se pudo establecer la conexi&oacute;n');
mysql_select_db("xxx",$link)
or die ('Lo sentimos, no se pudo establecer la conexi&oacute;n');
$result = mysql_db_query ("xxx","select * from productos where cod_prod='".mysql_real_escape_string($id)."'",$lin k)
or die ("Fallo en la consulta");
if ($linea=mysql_fetch_object($result))
{
//------La capa empieza aqui------

$consultaimag2 = "select * from imag_relac where cod_prod ='".mysql_real_escape_string($id)."'";
$resultid = mysql_query($consultaimag2,$link)
or die ("Fallo en la consulta");
while ($lineaimag2=mysql_fetch_object($resultid))
{
?>
<div id="<? echo $lineaimag2->imagen;?>" style="position:absolute; left:0px; top:73px; width:100%; z-index:<? echo $num_filas;?>; visibility: hidden; border: 0px none #000000; background-color: #00FF00; layer-background-color: #00FF00;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr> <td align="center" valign="baseline"><img src="../<? echo $lineaimag2->imagen;?>" border="0"></td></tr></table></div>
<?
$num_filas++;
} //termina el bucle while imag2
?>

//----La capa termina aqui-------

//----Imagen grande------
<td colspan="4" align="center" valign="baseline">
<div id="imagen" style="position:relative; left:0px; top:0px; z-index:2; visibility: visible; border: 0px none #000000;">
<img src="<? echo $linea->imagen_g;?>" border="0"></div></td>

//------Imagen pequeña--------
<table border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<?
while ($lineaimag2=mysql_fetch_object($resultid))
{
?>
<td width="70" align="left" valign="bottom"><a href="#" onClick="MM_showHideLayers('<? echo $lineaimag2->imagen;?>','','show','imagen','','hide')"><img src='../redimensionar.php?archivo=<? echo $lineaimag2->imagen;?>&ancho=50&alto=50' alt="Ver imágen" border="0"></a></td>
<?
$num_filas++;
}
?></tr>
</table>

Bueno hay mas codigo pero solohepuesto lo importante creo

[okram]

Mira, no te compliques demasiado con capas y todo eso.... Usa puro javascript y tu codigo quedara mucho mas sencillo:

Entre las etiquetas <head> y </head> de tu documento coloca este codigo javascript:

Código:

function abrir_imagen(url) {
document.getElementById('imagen_grande').src = url;
}

Luego, buscas esto:

Código PHP:

 if ($linea=mysql_fetch_object($result))
{ 
//------La capa empieza aqui------
 
$consultaimag2 = "select * from imag_relac where cod_prod ='".mysql_real_escape_string($id)."'";
$resultid = mysql_query($consultaimag2,$link)
or die ("Fallo en la consulta");
while ($lineaimag2=mysql_fetch_object($resultid))
{ 
?>
<div id="<? echo $lineaimag2->imagen;?>" style="position:absolute; left:0px; top:73px; width:100%; z-index:<? echo $num_filas;?>; visibility: hidden; border: 0px none #000000; background-color: #00FF00; layer-background-color: #00FF00;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr> <td align="center" valign="baseline"><img src="../<? echo $lineaimag2->imagen;?>" border="0"></td></tr></table></div>
<?
$num_filas++;
} //termina el bucle while imag2
?>
 
//----La capa termina aqui-------  

y lo reemplazas por:

Código PHP:

  //Por nada :P, solo lo borras  
   

Buscas:

Código HTML:

//----Imagen grande------
<td colspan="4" align="center" valign="baseline"> 
<div id="imagen" style="position:relative; left:0px; top:0px; z-index:2; visibility: visible; border: 0px none #000000;">
<img src="<? echo $linea->imagen_g;?>" border="0"></div></td> 

y reemplazas por:

Código HTML:

//----Imagen grande------
<td colspan="4" align="center" valign="baseline"> 
<div id="imagen_grande" style="visibility: visible; border: 0px none #000000;">
<img src="<? echo $linea->imagen_g;?>" border="0"></div></td> 

ahora, buscas:

Código PHP:

 //------Imagen pequeña--------
<table border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<?
while ($lineaimag2=mysql_fetch_object($resultid))
{ 
?>
<td width="70" align="left" valign="bottom"><a href="#" onClick="MM_showHideLayers('<? echo $lineaimag2->imagen;?>','','show','imagen','','hide')"><img src='../redimensionar.php?archivo=<? echo $lineaimag2->imagen;?>&ancho=50&alto=50' alt="Ver imágen" border="0"></a></td>
<?
$num_filas++;
}
?></tr>
</table>  

y lo cambias por:

Código PHP:

 //------Imagen pequeña--------
?>
<table border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<?
while ($lineaimag2=mysql_fetch_object($resultid))
{ 
?>
<td width="70" align="left" valign="bottom"><a href="#" onClick="abrir_imagen('<? echo $lineaimag2->imagen;?>');"><img src='../redimensionar.php?archivo=<? echo $lineaimag2->imagen;?>&ancho=50&alto=50' alt="Ver imágen" border="0"></a></td>
<?
$num_filas++;
}
?></tr>
</table>  

listo, asi deberia funcionar, creo.... si no respondes, ahora estoy de salida, asi que lo hice bastante rapido y probablemete tenga algun error, mañana a primera hora entrare para ver si te resulto...

Salu2

[Alejandr4]

Como bien dices me da error en la página de todos modos en el texto de javascript donde has puesto imagen grande ¿por que pone eso? y como sabe donde debe abrirse la imagen? Soy bastante novatilla. De todos modos creo entender que lo que supones que haces es abrir la imagen pero no cultas la otra entonces que psa si la de abajo es mas grande? Pues se verá por eso yo quise hacerlo con capas, también pensé bueno pues la abro con un fonde en la tabla y asi no se ve la de abajo pero queda mal porque la pagina lleva un fondo y entonces se descuadra todo. Bueno aver si al final lo arreglamos.
Muchas gracias
Alejandra

P.D: mañana la mañana no estaré evndré sobre las 3 asi que cuandolo vea te dejaré un mensaje privado para que no andes pendiente del post

[Alejandr4]

Bueno ahora no da error, he cambiado donde pones imagen_grande por imagen (porque he supuesto que te refieres a la id de la capa) pero simplemente no pasa nada,jeje!
Si quieres ver la web es:
hasiandasha.com/castellano/producto2.php?id=00001#

[okram]

Hola,,, jaja ayer se me vino a la mente cusando estaba a punto de dormir un error en el codigo que te di...

Bien, lo que pretendo hacer es dara la imagen un id 'imagen_grande' (OJO: a la imagen, no al div como te puse en el codigo ), y con la funcion lo que haces es redefinir la ruta de la imegn,m por lo que esta se volvera a abrir:

la funcion:

Código:

function abrir_imagen(url) {
document.getElementById('imagen_grande').src = url;
}
 

Como ves, estos llamando a un objeto que tenga id 'imagen_grande', luego redefino la propiedad src y le doy el valor de url que le llega por la funcion.

Iniciado por Alejandr4

[...]pero no cultas la otra entonces que psa si la de abajo es mas grande?

como ya mencione, lo que se haceno es crear una nueva imagen que sobrepondrá a la anterior, simpolemente es reabrir la imagen anterior, o reemplazarla mejor dicho.

CORRECIONES:

la funcion javascript, queda asi:

Código:

function abrir_imagen(url) {
document.getElementById('imagen_grande').src = url;
}
 

donde muestras la imagen grande; buscaesto:

Código HTML:

//----Imagen grande------
<td colspan="4" align="center" valign="baseline"> 
<div id="imagen_grande" style="visibility: visible; border: 0px none #000000;">
<img src="<? echo $linea->imagen_g;?>" border="0"></div></td> 

y lo cambias por (como ves, el id "imagen_grande" lo puse al div por error, debe ir en la imagen):

Código HTML:

//----Imagen grande------
<td colspan="4" align="center" valign="baseline"> 
<div style="visibility: visible; border: 0px none #000000;">
<img src="<? echo $linea->imagen_g;?>" border="0" id="imagen_grande"></div></td> 

Listo, asi deberia funcionar bien (creo... )

Si tienes algun problema me avisas...

Salu2

[Alejandr4]

Ayyyy, que asco me das coño,jejejeje! Lo que hace el saber, yo aquí complicandome la vida con capas y la leche y mira tu con que chorrada funciona perfectamente, va super bien, oye hay alguna página de jascript para ver todo lo que se puede hacer porque igual me complico todo con php y mira tu.

Joooo no sabes como te lo agardezco
Mil gracias
Te voy aescribir un mensaje privado para preguntarte una cosa porque en este foro igual me lo quitan porque no es de php
Muchas gracias de nuevo
Alejandra

[okram]

Iniciado por Alejandr4

[...]porque en este foro igual me lo quitan porque no es de php

Recuerda que tienes muchos foros sobre varios temas, no solo está el de php. Lei tu pregunta, y podrias ponerla en el foro de Web Hosting, para ver la lista de foros dirigete a la página principal (http://www.forosdelweb.com/) y ahi veras todas las categorias que estan disponibles

Un saludo,