hola amigos del foro .. estoy adaptando este codigo para presentar info de unos especialistas ... funciona muy bien .. pero no he logrado visualizar ademas de la imagen la info al lado de esta .. datos como nombre, apellido, ciudad
este es el codigo que tengo hasta ahora .. si alguien tiene una idea ... gracias por la ayuda
index.php
Código PHP:
<html>
<head>
<link rel="stylesheet" href='slideshow.css' type="text/css" />
<script type="text/javascript" src="slideshow.js"></script>
<title>presentacion</title>
</head>
<body>
<div id="rotator">
<?
//Archivo de conexion
require("../connect.php");
$regusuario = $sql->seleccionarLibre("SELECT * FROM regusuario group BY nombres ASC");
if($regusuario)
{
foreach($regusuario as $reg)
{
$esp = $sql->seleccionar("especialista","*","IdUsuario =".$reg['IdUsuario']);
if($esp[img_especialista]){
$trozos = explode (".",$esp['img_especialista']);
$img= $trozos[0]."_m.".$trozos[1];
?>
<a href="<?php echo "../ver_especialistas.php?ide=".$esp[idEspecialista]."&idc=".$esp[idCiudad]."&ids=".$esp[idSubespecialidad] ?>" class="ciudades"><img src="../imgespec/<?php echo $img ?>" width="150" height="109" border="0"></a>
<?
}//Fin del if
}//Fin foreach
}//Fin del if
?>
</div>
</body>
</html>
slideshow.css
Código PHP:
*
{
margin: 0;
padding: 0;
}
#rotator
{
border: 1px solid #000;
overflow: hidden;
margin: 50px auto 10px;
position: relative;
width: 150px; /*Aquí puedes editar*/
height: 109px;/*estos valores para cambiar el tamaño pero recuerda cambairlos abajo también*/
}
#rotator img
{
border: 0;
width: 150px;
height: 109px;
}
p
{
text-align: center;
}
slideshow.js
Código PHP:
/*********************************************************************************************************/
window.addEventListener?window.addEventListener('load',so_init,false):window.attachEvent('onload',so_init);
var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;
function so_init()
{
if(!d.getElementById || !d.createElement)return;
css = d.createElement('link');
css.setAttribute('href','slideshow2.css');
css.setAttribute('rel','stylesheet');
css.setAttribute('type','text/css');
d.getElementsByTagName('head')[0].appendChild(css);
imgs = d.getElementById('rotator').getElementsByTagName('img');
for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
imgs[0].style.display = 'block';
imgs[0].xOpacity = .99;
setTimeout(so_xfade,3000);
}
function so_xfade()
{
cOpacity = imgs[current].xOpacity;
nIndex = imgs[current+1]?current+1:0;
nOpacity = imgs[nIndex].xOpacity;
cOpacity-=.05;
nOpacity+=.05;
imgs[nIndex].style.display = 'block';
imgs[current].xOpacity = cOpacity;
imgs[nIndex].xOpacity = nOpacity;
setOpacity(imgs[current]);
setOpacity(imgs[nIndex]);
if(cOpacity<=0)
{
imgs[current].style.display = 'none';
current = nIndex;
setTimeout(so_xfade,3000);
}
else
{
setTimeout(so_xfade,50);
}
function setOpacity(obj)
{
if(obj.xOpacity>.99)
{
obj.xOpacity = .99;
return;
}
obj.style.opacity = obj.xOpacity;
obj.style.MozOpacity = obj.xOpacity;
obj.style.filter = 'alpha(opacity=' + (obj.xOpacity*100) + ')';
}
}
