• Joomla

    Posted on enero 4th, 2012

    Written by jdcastro

    Tags

    ,

    En algún momento te topas con un diseño en el que sus requerimientos te llevan a igualar el alto de las columnas, por ejemplo que user1, user2, user3… presenten el mismo alto porque buscamos simetría o bien sea por capricho de un diseñador gráfico que se cree diseñador Web que quiere ver el background de left y right al mismo alto aunque la situación no ayude a nadie ni mejore la presentación.

    Bueno, aquí la solución, con jat3 framework el asunto es simple y lo resumiré por temas de tiempo ;)
    Paso 1° extrae de plg_system_jat3 el archivo que necesites, en mi caso voy a igualar left, right y content, por lo que he de utilizar el archivo que maneja su presentación, es decir: page/default.php ( http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Guides ) puedes bien editar directamente el plugin, pero la desventaja es que no podrás actualizar sin perder tus cambios, así que lo ideal es que copies en la carpeta de tu theme el archivo (copia page/default.php al root de tu theme).

    Aquí es carpintería, pero daré un ejemplo:
    <div id="ja-content" style="width:<?php echo $this->getColumnWidth('cw') ?>%">
    y lo cambias por:
    <div id="ja-content sameheight" style="width:<?php echo $this->getColumnWidth('cw') ?>%">

    Haaces lo mismo para cada columna a igualar, recuerda, sameheight bien pudo ser fooheight, pon el nombre que gustes, lo importante es luego usar js para igualarlas (recuerda, joomla/t3 usan mootools, blah, blah…)
    y antes de MAIN CONTAINER pega el sigiuente código:

    ...

    <script type="text/javascript">
    window.addEvent('load', function (){ equalHeight ('.sameheight') });
    </script>
    <!-- MAIN CONTAINER -->
    ....

    Listo, ya tendrás columnas con alturas iguales.

    This entry was posted on Miércoles, enero 4th, 2012 at 4:33 am and is filed under Joomla. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
  • 0 Comments

    Take a look at some of the responses we've had to this article.

  • Leave a Reply

    Let us know what you thought.

  • Name (required):

    Email (required):

    Website:

    Message: