Example #1
0
        <h2>PHP - devildrey33_Lab::CrearMiniLab</h2>
        <p>Tambè pots fer servir el editor dinamic per HTML5 / CSS3 / JS, amb la funció : <linea cid="ID5" l="1">devildrey33_Lab::CrearMiniLab(<code>array</code>)</linea>.</p>
<?php 
/* -[INICIO devildrey33.IDC5]-
<?php devildrey33_Lab::CrearMiniLab(array("Ejemplos/Checked/CheckBox-personalizado.html")); ?>
-[FIN devildrey33.IDC5]- */
$Web->PintarCodigo->PintarArchivoPHP("ID5", "", basename(__FILE__), 'IDC5');
?>

        <p>Aquest editor requereix que el codi a mostrar estigui dintre de la carpeta <i>/Ejemplos</i>, i tambè ha d'estar a la llista d'arxius permesos.</p>
        <p>Per editar la llista d'arxius permesos en el laboratori, has d'entrar al laboratori, loguejarte, i obrir l'exporador d'exemples (tercer icona del menu de la dreta).</p>
        <p>El parametre array es un o mes strings amb paths d'exemple : <code>'Ejemplos/Checked/CheckBox-personalizado.html'</code></p>
        <div class='nota'>Sobretot el string ha de començar sempre amb <code>'Ejemplos/...'</code> i sense la primera barra. Si no et donara error.</div>
        
        <?php 
devildrey33_Lab::CrearMiniLab(array("Ejemplos/Checked/CheckBox-personalizado.html"));
?>
        
        <hr />
        <h2>Crear una nova entrada al Blog</h2>
        <p>Per crear /editar / eliminar una entrada al blog has d'editar l'arxiu : <code>/Web/Config/EntradasBlog.php</code>.</p>       
        <p><strike>En principi tambè tinc un editor online desde <i>Admin -> Editar Entradas</i>, pero encara <b>no funciona</b>.</strike></p>
        <p>Si necesites afegir alguna Categoria de l'index has d'editar l'arxiu : <code>/Web/Config/EntradasTags.php</code></p>
        <br /><hr />
        <h2>NOTES Finals</h2>
        <p>Rebras un missatge al teu correu cada cop que algu escrigui un missatge a un article teu. <b>(S'HA DE PROBAR)</b></p>
        <p>Ves amb oju a l'hora d'escriure PHP, perque hi ha un objecte estatic PHP que es diu <code>Base</code>, i un objecte jQuery que tambè es diu <code>$Base</code>.</p>
        <p>I per ultim... si per un casual et dona per activar el Mantenimiento QUE NO HAURIES DE POGUER, i no saps com treurel proba aquesta URL <code>/cmd/DesactivarMantenimiento</code>, i si no funciona carrega el backup de l'arxiu <code>.htaccess</code> de l'arrel... </p>
    
    </article>
                <p>Ahora veamos el CSS normal :</p>
                <?php 
$Base->PintarCodigo->PintarArchivoCSS("ID_FlexCSS1", "CSS Flex-Box", "../Ejemplos/FlexBox/Documento.html", "FlexCSS1");
?>
                <p>En primer lugar podéis ver que establezco la propiedad <a href="/Doc/CSS/Propiedades/display">display</a> a <linea cid='ID_FlexCSS1' l='3'>flex</linea>, para indicarle al navegador que debe usar el modelo FlexBox en él.</p>
                <p>Luego en la <linea cid='ID_FlexCSS1' l='4'>línea 4</linea> utilizo la propiedad <a href="/Doc/CSS/Propiedades/flex-flow">flex-flow</a> para establecer que el contenedor flex, mostrará sus hijos de izquierda a derecha.</p>
                <p>Para las etiquetas <linea cid='ID_FlexCSS1' l='13'>nav</linea>,  <linea cid='ID_FlexCSS1' l='7'>article</linea>, y  <linea cid='ID_FlexCSS1' l='18'>aside</linea>, establezco en primer lugar el <linea cid='ID_FlexCSS1' l='8,14,19'>ancho que ocupan</linea> con la propiedad <a href="/Doc/CSS/Propiedades/flex">flex</a>, y luego <linea cid='ID_FlexCSS1' l='9,15,20'>establezco el orden</linea> de dichas etiquetas con la propiedad <a href="/Doc/CSS/Propiedades/order">order</a>. De esta forma el <code>nav</code> quedara ubicado a la izquierda, el <code>article</code> en medio y el <code>aside</code> a la derecha.</p>
                <p>Con esto ya tenemos la estructuración normal creada (resolución para mas de 500 pixeles de ancho), ahora veamos cómo se debe establecer la distribución para resoluciones menores de 500 pixeles de ancho.</p>
                <h2>CSS para la vista con el ancho reducido</h2><br />
                <?php 
$Base->PintarCodigo->PintarArchivoCSS("ID_FlexCSS2", "CSS MediaQuery + Flex-Box", "../Ejemplos/FlexBox/Documento.html", "FlexCSS2");
?>
                <p>En la <linea cid='ID_FlexCSS2' l='2'>segunda línea</linea> vemos la regla <a href="/Doc/CSS/Reglas/@media">@media</a>, que es la encargada de establecer los estilos del documento cuando este es menor que 500 pixeles de ancho.</p>
                <p>La otra parte destacable de este código, es la <linea cid='ID_FlexCSS2' l='11'>línea 11</linea> donde establezco la propiedad <a href="/Doc/CSS/Propiedades/order">order</a> a 0. Esto hace que las etiquetas <code>nav</code>, <code>article</code>, y <code>aside</code> vuelvan a su posición original, es decir primero el <code>article</code>, luego el <code>nav</code>, y por último el <code>aside</code>, tal y como está maquetado el HTML inicialmente.</p>

                <p>Y esto es todo por hoy, si quereis podéis trastear con el ejemplo aquí mismo o desde el laboratorio de pruebas.</p>
                
                <?php 
devildrey33_Lab::CrearMiniLab(array("Ejemplos/FlexBox/Documento.html"));
?>
                
                
<!--                <a href="/Lab/Ejemplos/FlexBox/Documento.html" class='Boton Centrado'>Ver Ejemplo</a> -->

                
                
<?php 
$Base->FinBlog();
$Base->FinPlantilla();
?>
     
 /*            if ($PosSabiasQue !== false) {
                 $SabiasQue = substr($DatosArchivo, $PosSabiasQue, ($PosCompatibilidad - $PosSabiasQue));
             }*/
 $ArchivoEjemplo = "../Ejemplos/" . $Path . "CSS/" . $NombreCSS . ".html";
 $EnlaceEjemplo = "/Lab/Ejemplos/" . $Path . "CSS/" . $NombreCSS . ".html";
 // Si existe el ejemplo lo mostramos
 $FechaEjemplo = "";
 if (file_exists($ArchivoEjemplo)) {
     //                $Base->CrearBotonLab("BotonLab1", $ArchivoEjemplo, "Ver ejemplo", TRUE);
     echo "<hr /><h2>Código de ejemplo</h2><br />";
     if ($Entrada === false) {
         devildrey33_Lab::CrearMiniLab(array("Ejemplos/" . $Path . "CSS/" . $NombreCSS . ".html"));
     } else {
         $ArrayEntradas = $Entrada["EjemplosExtra"];
         array_unshift($ArrayEntradas, "Ejemplos/" . $Path . "CSS/" . $NombreCSS . ".html");
         devildrey33_Lab::CrearMiniLab($ArrayEntradas);
     }
     /*                echo "<div style='display:table; margin:auto;'><a href='".$EnlaceEjemplo."'><button>Ver ejemplo</button></a></div>";
                     
                     echo "<div style='clear:both'></div>";
     
                     $Base->PintarCodigo->PintarArchivoHTML('CodigoPC_'.$NombreCSS, $PathBD.' '.$NombrePropiedad, $ArchivoEjemplo);
                     echo "<br /><br />";*/
     $FechaEjemplo = date("d/m/Y", filemtime($ArchivoEjemplo));
 } else {
     echo "<span style='color:red'>" . $ArchivoEjemplo . "</span>";
 }
 echo "<hr />";
 if ($PosSabiasQue !== false) {
     echo substr($DatosArchivo, $PosSabiasQue, $PosCompatibilidad - $PosSabiasQue);
 }
Example #4
0
 public static function HerramientasAdmin($Login, $Pass, $Loguear = TRUE)
 {
     $EstadoLogin = "******";
     $HTMLAdmin = "";
     if ($Loguear === TRUE) {
         $EstadoLogin = devildrey33_Opciones::Login($Login, $Pass);
     }
     if (devildrey33_Opciones::Administrador() > 0) {
         $MinHTML = devildrey33_Opciones::Minificar_HTML() === 1 ? "true" : "false";
         $MinCSS = devildrey33_Opciones::Minificar_CSS() === 1 ? "true" : "false";
         $MinJS = devildrey33_Opciones::Minificar_JS() === 1 ? "true" : "false";
         $Consola = devildrey33_Opciones::MostrarConsola() === 1 ? "true" : "false";
         $PHPDebug = devildrey33_Opciones::MostrarErroresPHP() === 1 ? "true" : "false";
         $BorrarPHP = devildrey33_Opciones::BorrarLogPHP() === 1 ? "true" : "false";
         $Cache = devildrey33_Opciones::ActualizarCache() === 1 ? "true" : "false";
         $PausarBanner = devildrey33_Opciones::PausarBannerJS() === 1 ? "true" : "false";
         $ValHT = devildrey33_htaccess::ObtenerValores();
         $HTMLAdmin = "<input id='BarraPrincipal_Boton33_Estado' class='Menu_Boton_Input' type='checkbox' />" . Intro() . "<label class='Menu_Boton_Label' for='BarraPrincipal_Boton33_Estado' tooltip-es='Administración' tooltip-en='Administration' tooltip-pos='L'></label>" . Intro() . "<div class='Menu_Boton'>" . Intro() . "<span class='Menu_Boton_Cruz'>" . Intro() . "<img class='Menu_Boton_SVG' src='" . Base::URL_Web() . "SVG/Iconos50x50.svg#svg-marco33' />" . Intro() . "</span>" . Intro() . "</div>" . Intro() . "<div class='Menu_Marco' id='BarraPrincipal_Marco33'>" . Intro() . "<table class='MarcoOpciones2C MarcoOpcionesBorde' titulo='Sesión'>" . Intro() . "<tr>" . Intro() . "<td>Administrador</td>" . Intro() . "<td><div id='CH_Admin' class='CheckBox' marcado='true' title='Desactiva el modo administrador'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Comprimir HTML</td>" . Intro() . "<td>" . "<div id='CH_HTML' class='CheckBox' marcado='" . $MinHTML . "' title='Comprime el HTML eliminando saltos de línea'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Comprimir CSS</td>" . Intro() . "<td>" . "<div id='CH_CSS' class='CheckBox' marcado='" . $MinCSS . "' title='Comprime el CSS eliminando comentarios, espacios, tabulaciones, y saltos de línea.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Comprimir JS</td>" . Intro() . "<td>" . "<div id='CH_JS' class='CheckBox' marcado='" . $MinJS . "' title='Comprime el JS eliminando comentarios, espacios, tabulaciones, y saltos de línea.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Actualizar Cache</td>" . Intro() . "<td>" . "<div id='CH_Actualizar' class='CheckBox' marcado='" . $Cache . "' title='Comprime los archivos JS y CSS para crear su version minificada.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Mostrar Debug PHP</td>" . Intro() . "<td>" . "<div id='CH_DebugPHP' class='CheckBox' marcado='" . $PHPDebug . "' title='Muestra las advertencias y errores php en el mismo output'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Borrar Debug PHP</td>" . Intro() . "<td>" . "<div id='CH_BorrarPHP' class='CheckBox' marcado='" . $BorrarPHP . "' title='Elimina el archivo log con los errores PHP antes de ejecutar código'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "</table>" . Intro() . "<div>" . Intro() . "<table class='MarcoOpciones2C MarcoOpcionesBorde' titulo='JavaScript'>" . Intro() . "<tr>" . Intro() . "<td>Mostrar Debug JS</td>" . Intro() . "<td>" . "<div id='CH_Consola' class='CheckBox' marcado='" . $Consola . "' title='Muestra datos de depuración por la consola'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Pausar banner</td>" . "<td>" . "<div id='CH_PausarBanner' class='CheckBox' marcado='" . $PausarBanner . "' title='Desactiva el banner cuando no está visible o cuando la pestaña pierde el foco.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "</table>" . Intro();
         if (devildrey33_Opciones::Administrador() === 1) {
             $HTMLAdmin .= "<div class='MarcoOpcionesBorde' titulo='.htaccess'>" . Intro() . "<table class='MarcoOpciones2C'>" . Intro() . "<tr>" . Intro() . "<td>Compresion gzip</td>" . Intro() . "<td>" . "<div id='CH_CompresionGZip' class='CheckBox' marcado='" . $ValHT["CompresionGZip"] . "' title='Todos los datos son comprimidos con gzip antes de ser enviados.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "<tr>" . Intro() . "<td>Cache Imagenes</td>" . Intro() . "<td>" . "<div id='CH_CacheImagenes' class='CheckBox' marcado='" . $ValHT["CacheImagenes"] . "' title='Indica al navegador que puede cachear las imagenes durante un mes'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "<tr>" . Intro() . "<td>Mantenimiento</td>" . Intro() . "<td>" . "<div id='CH_Mantenimiento' class='CheckBox' marcado='" . $ValHT["Mantenimiento"] . "' title='Anula todas las urls y muestra un mensaje de mantenimiento.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "<tr>" . Intro() . "<td>CheckSpelling</td>" . Intro() . "<td>" . "<div id='CH_CheckSpelling' class='CheckBox' marcado='" . $ValHT["CheckSpelling"] . "' title='Redirige una petición no encontrada a una url similar. \nPor ejemplo si vamos a /index2.php se redirige a /index.php automáticamente.'>" . "<div></div>" . "<div></div>" . "</div>" . "</td>" . Intro() . "</tr>" . Intro() . "</table>" . Intro() . "<button class='Boton-Normal' id='CH_IPSBan' title='Elimina todas las ips baneadas de la lista'>Limpiar ips baneadas</button>" . Intro() . "</div>" . Intro() . "</div>" . Intro();
         }
         $HTMLAdmin .= "<div class='MarcoOpcionesBorde' titulo='Varios PHP'>" . Intro() . "<button class='Boton-Normal' id='CH_Logs'>Log</button>" . Intro() . "<button class='Boton-Normal' id='CH_Stats'>Stats</button>" . Intro() . "<button class='Boton-Normal' id='CH_PhpInfo'>PHP Info</button>" . Intro() . "<button class='Boton-Normal' id='CH_GenCacheBuscador'>Gen Cache Buscador</button>" . Intro() . "</div>" . Intro() . "</div>" . Intro();
         // #BarraPrincipal_Marco33
     }
     // La función para loguear se utiliza tanto via ajax como al iniciar, por lo que tengo que pasar los errores PHP SOLO desde ajax.
     // Si añado los errores en la misma función de HerramientasAdmin se borraria una parte del log de errores al loguear desde devildrey33.php
     // En definitiva no hay que utilizar Base::ObtenerLogPHP() desde esta función
     return array("Estado" => $EstadoLogin, "HTMLAdmin" => $HTMLAdmin, "ExplorarLab" => devildrey33_Lab::MostrarCarpetaEjemplos());
 }
Example #5
0
}
/* Modo : Pantalla completa, portable */
if (isset($_GET["Modo"])) {
    $Modo = $_GET["Modo"];
} else {
    $Modo = "";
}
// Vista del editor
if (isset($_GET["Editor"])) {
    $Editor = $_GET["Editor"];
} else {
    $Editor = "";
}
include "devildrey33.php";
$Base = new devildrey33();
$CArchivo = devildrey33_Lab::AbrirEjemplo($Archivo, -1);
/*    echo "<pre>";
    print_r($sArchivo);
    echo "</pre>";*/
$HEAD = "";
$Base->InicioPlantilla(basename(__FILE__), "Laboratorio de pruebas", $HEAD);
/*    if ($CArchivo["Ret"] != 200) { // Error al abrir el archivo
        $Archivo = "Ejemplos/Error.html"; 
//        $MostrarError = TRUE;
        $CArchivo = devildrey33_Lab::AbrirEjemplo($Archivo, -1);
    }*/
//    echo $_SERVER["REQUEST_URI"];
/* Maquetacio a pantalla completa */
/*    echo "<pre>";
    print_r($_SERVER);
    echo "</pre>";*/
 public function LabGuardarEjemplo()
 {
     if (devildrey33_Opciones::Administrador() > 0) {
         echo devildrey33_Lab::GuardarEjemplo($_POST["Archivo"], $_POST["Codigo"]);
     } else {
         $this->Desloguear(1);
     }
 }
    
            <h2>Obtener y modificar variables CSS desde JavaScript</h2>
            <p>Hasta ahora hemos visto como crear y utilizar variables en el CSS, pero que pasa si necesitamos mostrar o modificar una variable via JavaScript? Aquí la cosa se complica ya que nos va a tocar acceder a los estilos computados por el navegador.</p>
            <p>El siguiente ejemplo nos muestra como obtener una variable global desde los estilos computados por el navegador :</p>
            <?php 
$Web->PintarCodigo->PintarArchivoJS("obtenervariable", "Obtener una variable global del CSS", basename(__FILE__), 'obtenervariable');
?>
            
            <p>La función del ejemplo anterior nos devuelve el contenido de la variable <b>global</b> que especifiquemos.</p>
            <p>En la <linea cid='obtenervariable' l='2'>segunda línea</linea> obtengo los estilos computados con la función <code>window.getComputedStyle</code>, para después en la <linea cid='obtenervariable' l='3'>línea 3</linea> utilizar la función <code>getPropertyValue</code>, que nos devolverá el valor de la propiedad o en este caso variable especificada.</p>
            <div class='nota'>El problema de los estilos computados es que no podemos acceder al CSS de forma abstracta y solo disponemos del CSS que ha sido computado para cada elemento. Si queremos acceder a una variable que no esté en el ámbito global, vamos a tener que especificar en la función <linea cid='obtenervariable' l='2'>getComputedStyle</linea> una etiqueta bajo ese ámbito en vez del <linea cid='obtenervariable' l='2'>document.body</linea>.</div>  
            <p>Veamos como asignar un valor a una variable <b>global</b> del CSS :</p>            
            <?php 
$Web->PintarCodigo->PintarArchivoJS("asignarvariable", "Asignar un valor a una variable global del CSS", basename(__FILE__), 'asignarvariable');
?>
            <p>Como veis en el ejemplo anterior se utiliza la función <code>style.setProperty</code>, de un elemento que se encuentre dentro del ámbito de la variable. En este caso como la variable es global podemos utilizar <code>document.body</code> directamente.</p>
            <p>Por último os dejo un ejemplo que modifica vía JavaScript cuatro variables que contienen los colores de los cuatro marcos que tiene el ejemplo.</p>
            <?php 
devildrey33_Lab::CrearMiniLab(array("Ejemplos/VariablesCSS/javascript.html"));
?>
        
            

<?php 
$Web->FinBlog();
$Web->FinPlantilla();
?>


	
 public function LabAbrirEjemplo()
 {
     echo json_encode(devildrey33_Lab::AbrirEjemplo($_POST["Archivo"], $_POST["ID"], TRUE));
 }
$Base->PintarCodigo->PintarArchivoCSS("circular", "Clase Boton-Circular", "../Ejemplos/Transition/Botones.html", "circular");
?>
            </td>
            <td>
                <ul id="Capas4">
                    <li class="Capas_Vista">
                        <div>Circular</div>
                        <div></div>
                        <div></div>        
                    </li>
                </ul>    
            </td>
        </tr>
    </table>  
    <p>Lo mas importante de este fragmento de código son las <linea cid='circular' l='7,8,9'>lineas 7, 8, 9</linea> que centran la capa animación sea cual sea su tamaño. Para ello asignamos la propiedades <code><a href='/Doc/CSS/Propiedades/top' cid='circular' l='7'>top</a></code> y <code><a href='/Doc/CSS/Propiedades/top' cid='circular' l='8'>left</a></code> al 50%, para luego utilizar la propiedad <code><a href='/Doc/CSS/Propiedades/transform' cid='circular' l='9'>transform</a></code> con un -50% a las coordenadas X e Y.</p>
    <p>Finalmente en el evento <code><a href='/Doc/CSS/Selectores/:hover' cid='circular' l='11' >:hover</a></code> establecemos las propiedades <code><a href='/Doc/CSS/Propiedades/width' cid='circular' l='11'>width</a></code> y <code><a href='/Doc/CSS/Propiedades/height' cid='circular' l='11'>height</a></code> a 300 pixeles.</p>
    <div class='nota'>Lo malo de este efecto es que para que salga un círculo perfecto debemos asignar el <code><a href='/Doc/CSS/Propiedades/width' cid='circular' l='11'>width</a></code> y el <code><a href='/Doc/CSS/Propiedades/height' cid='circular' l='11'>height</a></code> al mismo tamaño si queremos que el efecto sea circular, y no elíptico. Esto puede ser un problema a partir de ciertos tamaños, ya que contra mas grande sea el circulo final, mas rápida será la transición hasta el punto de que llegue a ser imperceptible.</div>    
    <div class="Centrado">
        <button class='Boton-Circular'>Boton-Circular</button>
    </div>
    <hr />
    <h2>Ejemplo completo</h2>
    <p>Y esto es todo por hoy, como siempre tenéis el ejemplo completo a vuestra disposición para que podáis hacer las pruebas que queráis.</p>
    <?php 
devildrey33_Lab::CrearMiniLab(array("Ejemplos/Transition/Botones.html"));
?>
                
    
<?php 
$Base->FinBlog();
$Base->FinPlantilla();
                        <td><b>Línea 30 :</b></td>
                        <td>Finalmente cuando el checkbox está marcado rotamos el sub-menú a 0 grados del eje Y con la propiedad <a href='/Doc/CSS/Propiedades/transform'>transform</a> para que sea visible.</td>
                    </tr>
                    
                </table>
                
                <p>Lo más importante del CSS es determinar un estado normal/desmarcado (Líneas 9-14 y 18-28), y un estado para cuando el checkbox está marcado (Líneas 16 y 30). Para determinar si está marcado utilizamos el selector <a href='/Doc/CSS/Selectores/:checked'>:checked</a>.</p>
                <hr />
                <h2>Ejemplo CheckBox</h2>
                <p>Finalmente podéis ver el ejemplo en vivo y toquetear un poco si queréis :</p>
                
                <?php 
devildrey33_Lab::CrearMiniLab(array("Ejemplos/Checked/CheckBox-personalizado.html"));
?>
                <hr />
                <h2>Ejemplo RadioButton</h2>
                <p>Los RadioButton están hechos para funcionar en grupo, de forma que solo puede haber un RadioButton marcado en cada grupo.</p>
                <p>Echad un vistazo al siguiente ejemplo :</p>
                <?php 
devildrey33_Lab::CrearMiniLab(array("Ejemplos/Checked/RadioButton-personalizado.html"));
?>
                <p>Notareis que mientras el código es similar, el funcionamiento del primer ejemplo y el segundo es distinto. En el primer ejemplo podemos tener los 3 menús marcados, y en el segundo ejemplo solo nos permite tener un menú marcado.</p>    
                <p>Como veis no ha hecho falta JavaScript en ninguno de los dos ejemplos, y los controles son plenamente funcionales y conscientes de sus estados en todo momento.</p>
                <p>En definitiva, esta técnica viene muy bien para terminar de encapsular dentro del CSS, aquellos momentos en que requiere alguna interacción por parte del usuario para hacer una animación/transición.</p>
                
                <p>Y con esto me despido por hoy, espero que os haya parecido interesante. Saludos!</p>
<?php 
$Base->FinBlog();
$Base->FinPlantilla();
?>
     
 public static function _EscanearDirectorioGG($Directorio)
 {
     $Entradas = (require dirname(__FILE__) . '/Config/ListaLab.php');
     //            static $ID = 0;
     $Codigo = "<div class='Lab_Lista'>";
     $Dir = opendir($Directorio);
     if ($Dir === FALSE) {
         $Codigo .= "<div>Error abriendo el directorio : " . $Directorio . "</div></div>";
         return;
     }
     while (false !== ($Archivo = readdir($Dir))) {
         if ($Archivo != "." && $Archivo != "..") {
             // Directorio
             if (is_dir($Directorio . "/" . $Archivo) === TRUE) {
                 $HREF = str_replace("..", "/Lab", $Directorio . "/" . $Archivo . "/");
                 if (devildrey33_Lab::_Buscar($Entradas, $HREF) == TRUE) {
                     $Codigo .= "<div class='Lab_Item'>" . Intro();
                     //                        if ($CheckBox === TRUE) echo "<input class='Lab_Explorador_Check' type='checkbox'".(devildrey33_Lab::_Buscar($Entradas, $HREF) == TRUE ? " checked='checked'" : "" )." />";
                     $Codigo .= "<div class='Lab_Directorio' path='" . $HREF . "'>" . Intro() . "<div class='Lab_IcoDirectorioC'></div>" . Intro() . "<span>" . $Archivo . "</span>" . Intro() . "</div>" . Intro() . "<div class='Lab_Directorio_Animacion'>" . Intro();
                     $Codigo .= devildrey33_Lab::_EscanearDirectorioGG($Directorio . "/" . $Archivo);
                     $Codigo .= "</div>" . Intro() . "</div>" . Intro();
                 }
             } else {
                 $HREF = str_replace("..", "/Lab", $Directorio . "/" . $Archivo);
                 if (devildrey33_Lab::_Buscar($Entradas, $HREF) == TRUE) {
                     $Codigo .= "<div class='Lab_Item'>" . Intro();
                     //                        if ($CheckBox === TRUE) echo "<input class='Lab_Explorador_Check' type='checkbox'".(devildrey33_Lab::_Buscar($Entradas, $HREF) == TRUE ? " checked='checked'" : "" )." />";
                     $Codigo .= "<div class='Lab_Archivo' path='" . $HREF . "'>" . Intro() . "<div class='Lab_IcoArchivo'></div>" . Intro() . "<a href='" . $HREF . "'>" . $Archivo . "</a>" . Intro() . "</div>" . Intro() . "</div>" . Intro();
                 }
             }
         }
     }
     $Codigo .= "</div>" . Intro();
     return $Codigo;
 }