taringozo
Usuario (Argentina)
Notación de color RGBAPara definir un color RGBA, se deben especificar cuatro valores, de la siguiente manera: rgba(255, 125, 0, 0.5); Los tres primeros valores son números en sistema decimal, que corresponden con los valores de rojo, verde y azul. Siempre tienen que ser números entre 0 y 255. El cuarto valor es un número entre 0 y 1. Por ejemplo 0 sería totalmente transparente, 1 sería totalmente opaco y 0.5 sería una transparencia al 50%, es decir, mitad opaco mitad transparente. Ejemplos de estilos CSS con colores definidos por RGBAAhora veamos varios ejemplos de colores definidos con CSS y la notación RGBA. <div style="background-color: rgba(0, 0, 255, 0.1);">Esta capa tiene fondo azul, casi transparente</div> <span style="color: rgba(0,255,0,0.8);">Este texto es verde y tiene un poco de transparencia</span> Pero aparte de estos ejemplos, lo ideal es ver el efecto de transparencia en marcha, para poder hacernos una idea más aproximada de las posibilidades. Para ello hemos construido una página donde se muestran varias capas con colores y transparencias, tanto en el fondo como en el texto. Ver ejemplo de colores CSS RGBA. Pero nuevamente llamamos la atención de los lectores sobre el hecho que, dependiendo del navegador que se utilice, se verán o no los distintos colores, puesto que las CSS 3 no son compatibles con todos los sistemas. Este ejemplo funcionará bien en navegadores que cumplen los estándares, como Firefox, Chrome o Safari, pero no en navegadores como Internet Explorer, que hacen la guerra por su cuenta. El código del anterior ejemplo es el siguiente: <html><head> <title>Colores RGBA con CSS 3</title><style type="text/css">div.cuadrado{ width: 150px; height: 40px; border: 1px solid #dddddd; margin: 5px;}div.textogrande{ font-family: verdana, arial, helvetica; font-weight: bold; font-size: 40pt;}</style></head><body><h1>Colores RGBA con CSS 3</h1><h2>Ejemplo de capas con fondo azul y varias transparencias</h2><div class="cuadrado" style="background-color: rgba(0, 0, 255, 0.1);"></div><div class="cuadrado" style="background-color: rgba(0, 0, 255, 0.4);"></div><div class="cuadrado" style="background-color: rgba(0, 0, 255, 0.7);"></div><div class="cuadrado" style="background-color: rgba(0, 0, 255, 1);"></div><h2>Ejemplo de capas con fondo verde y varias transparencias, sobre una capa con fondo amarillo</h2><div style="background-color: #ff3; padding: 10px;"><div class="cuadrado" style="background-color: rgba(0, 255, 0, 0.1);"></div><div class="cuadrado" style="background-color: rgba(0, 255, 0, 0.4);"></div><div class="cuadrado" style="background-color: rgba(0, 255, 0, 0.7);"></div><div class="cuadrado" style="background-color: rgba(0, 255, 0, 1);"></div></div><h2>Ejemplo de capas con fondo naranja y varias transparencias, sobre una capa con una imagen de fondo</h2><div style="background-image: url(http://www.desarrolloweb.com/articulos/ejemplos/photoshop/fondo-nieve/nieve.gif); padding: 10px;"><div class="cuadrado" style="background-color: rgba(255, 125, 0, 0.1);"></div><div class="cuadrado" style="background-color: rgba(255, 125, 0, 0.4);"></div><div class="cuadrado" style="background-color: rgba(255, 125, 0, 0.7);"></div><div class="cuadrado" style="background-color: rgba(255, 125, 0, 1);"></div></div><h2>Ejemplo de texto de color rojo y varias transparencias, sobre una capa con una imagen de fondo</h2><div style="background-image: url(http://www.desarrolloweb.com/articulos/ejemplos/photoshop/fondo-nieve/nieve.gif); padding: 10px;"><div class="textogrande" style="color: rgba(200, 0, 0, 0.3);">Este texto está para que se vea que puede ser también medio transparente</div><div class="textogrande" style="color: rgba(200, 0, 0, 0.7);">Este texto está para que se vea que puede ser también medio transparente</div></div></body></html> Si se permite mi opinión, es una pena que esta gestión de color con canal alpha no esté disponible en Internet Explorer 8, en el momento de escribir estas líneas, porque así se hace complicado usar este tipo de efectos. No obstante, es de suponer que las personas de Microsoft pondrán al día su navegador un año de estos, para hacerlo compatible con las CSS 3 y los colores RGBA.
<?php // para leer el directorio$ruta = "archivos/"; $filehandle = opendir($ruta); while ($file = readdir($filehandle)) { if ($file != "." && $file != ".." ) { $arch=$file; $archi=$arch.'*'.$archi; }}closedir($filehandle); // paginando$archivosfile=explode("*", $archi);$currentpage = $_SERVER['PHP_SELF']; // pagina en la que se encuentra$total=(count($archivosfile)-1);$maxRows_Blogdenotas = 10; // cantidad maxima de archivos a mostrar por pagina$pageNum_Blogdenotas = 0;if (isset($_GET['pag'])) { $pageNum_Blogdenotas = intval($_GET['pag']);}$startRow_Blogdenotas = $pageNum_Blogdenotas * $maxRows_Blogdenotas;if (isset($_GET['pag'])) { $pageNum_Blogdenotas = intval($_GET['pag']);}$startRow_Blogdenotas = $pageNum_Blogdenotas * $maxRows_Blogdenotas;$totalRows_Blogdenotas = $total;$totalPages_Blogdenotas = ceil($totalRows_Blogdenotas/$maxRows_Blogdenotas)-1;$archivos = array_slice($archivosfile, $startRow_Blogdenotas, $maxRows_Blogdenotas);// paginando ?>Total Archivos: <?php echo $total; ?><br /><br /><table border="0"> <tr> <td><?php if ($pageNum_Blogdenotas > 0) { // Show if not first page ?> <a href="<?php echo $currentpage; ?>?pag=0">Primero</a> <?php }else{ // Show if not first page ?> <span class="style1">Primero</span> <?php } ?> </td> <td><?php if ($pageNum_Blogdenotas > 0) { // Show if not first page ?> <a href="<?php echo $currentpage; ?>?pag=<?php echo htmlentities($_GET['pag']-1); ?>">Anterior</a> <?php }else{ // Show if not first page ?> <span class="style1">Anterior</span> <?php } ?> </td> <td><?php if ($pageNum_Blogdenotas < $totalPages_Blogdenotas) { // Show if not last page ?> <a href="<?php echo $currentpage; ?>?pag=<?php echo htmlentities($_GET['pag']+1); ?>">Siguiente</a> <?php }else{ // Show if not last page ?> <span class="style1">Siguiente</span> <?php } ?> </td> <td><?php if ($pageNum_Blogdenotas < $totalPages_Blogdenotas) { // Show if not last page ?> <a href="<?php echo $currentpage; ?>?pag=<?php echo $totalPages_Blogdenotas ?>">Ultimo</a> <?php }else{ // Show if not last page ?> <span class="style1">Ultimo</span> <?php } ?> </td> </tr> </table><div> Mostrando <?php echo ($startRow_Blogdenotas + 1) ?> a <?php echo min($startRow_Blogdenotas + $maxRows_Blogdenotas, $totalRows_Blogdenotas) ?> de <?php echo $totalRows_Blogdenotas ?></div><br /><br /><?phpforeach ($archivos as $archivo) { echo "<a href='$ruta$archivo'>$archivo</a><br>";}?>
Con este script podras leer tus imagenes dentro de una carpeta y mostrarlas en una div.mostrar.php <div style="width:100%;"> <?php $dir='imagenes/'; //nombre de la carpeta$images = glob("$dir{*.gif,*.jpg,*.png}", GLOB_BRACE); foreach($images as $v){ echo '<img src="'.$v.'" border="0" style="width:100px;float:left;margin:10px;" />'; } ?> </div>