[SOLUCIONADO][AYUDA] Numero de columnas

Iniciado por danimfi, Noviembre 25, 2013, 04:39:34 AM

Tema anterior - Siguiente tema

0 Miembros y 1 Visitante están viendo este tema.

Noviembre 25, 2013, 04:39:34 AM Ultima modificación: Agosto 14, 2014, 03:19:13 PM por blackdrake
Hola a todos, gracias de antemano y os cuento mi caso:

Mi consulta es sobre esta plantilla de wordpress

No tienes permitido ver los links. Registrarse o Entrar a mi cuenta

En la parte del menú donde pone portfolio, da 3 opciones: 2 columnas, 3 columnas y 4 columnas.
No se como hacer para poder poner 5, 6, o el numero que quiera!
La verdad es que no entiendo de programación, pero imagino que los tiros deben ir por esta parte del código:

Código: javascript
jQuery(document).ready(function($) {
    var $container = jQuery('#portfolio-grid'),
        filters = {};
   
    $container.imagesLoaded( function(){   
        setColumnWidth();
        $container.isotope({
            itemSelector : '.portfolio_item',
            resizable : false,
            transformsEnabled : true,
            layoutMode: 'fitRows'
        });     
    });
   
    function getNumColumns(){
       
        var $folioWrapper = jQuery('#portfolio-grid').data('cols');
       
        if($folioWrapper == '1col') {
            var winWidth = jQuery("#portfolio-grid").width();       
            var column = 1;     
            return column;
        }
       
        if($folioWrapper == '2cols') {
            var winWidth = jQuery("#portfolio-grid").width();       
            var column = 2;     
            if (winWidth<380) column = 1;
            return column;
        }
       
        else if ($folioWrapper == '3cols') {
            var winWidth = jQuery("#portfolio-grid").width();       
            var column = 3;     
            if (winWidth<500) column = 1;
            else if(winWidth>=500 && winWidth<788)  column = 2;
            else if(winWidth>=788 && winWidth<1160)  column = 3;
            else if(winWidth>=1160) column = 3;
            return column;
        }
       
        else if ($folioWrapper == '4cols') {
            var winWidth = jQuery("#portfolio-grid").width();       
            var column = 4;     
            if (winWidth<380) column = 1;
            else if(winWidth>=380 && winWidth<788)  column = 2;
            else if(winWidth>=788 && winWidth<1160)  column = 3;
            else if(winWidth>=1160) column = 4;     
            return column;
        }
    }
   
    function setColumnWidth(){
        var columns = getNumColumns();     
   
        var containerWidth = jQuery("#portfolio-grid").width();     
        var postWidth = containerWidth/columns;
        postWidth = Math.floor(postWidth);
       
        jQuery(".portfolio_item").each(function(index){
            jQuery(this).css({"width":postWidth+"px"});             
        });
    }
       
    function arrange(){
        setColumnWidth();       
        $container.isotope('reLayout');
    }
       
    jQuery(window).on("debouncedresize", function( event ) {   
        arrange();     
    });
   
   
    // Filter projects
    $('.filter a').click(function(){
        var $this = $(this).parent('li');
        // don't proceed if already active
        if ( $this.hasClass('active') ) {
            return;
        }

        var $optionSet = $this.parents('.filter');
        // change active class
        $optionSet.find('.active').removeClass('active');
        $this.addClass('active');

        var group = $optionSet.attr('data-filter-group');
        filters[ group ] = $this.find('a').attr('data-filter');
        // convert object into array
        var isoFilters = [];
        for ( var prop in filters ) {
            isoFilters.push( filters[ prop ] )
        }
        var selector = isoFilters.join('');
        $container.isotope({ filter: selector });

        return false;
    });
});


Agradezco vuestra ayuda!

Amigo, habia escrito todo una explicación larga de como funcionaba pero parece que el foro anda cuando quiere, culpa de cloudflare no me la mando, mi deducción era esta, por como funciona el sistema el ancho de una pc para que se puedan colocar 5 columnas tendrá que ser de 1500px, algo muy poco probable

Hola !

Quizás mi respuesta no resuelva del todo tu duda, pero los sistemas de grillas (grid), por lo general usan 12 columnas, lo porque la suma de todas las filas siempre tiene que dar "12" , me explico:
3 filas de 4 columnas = 12
2 filas de 6 columnas = 12
1 fila de 12 columnas = 12
4 filas de 3 columnas = 12
6 filas de 2 columnas = 12
Y en fin, siempre fíjate que la suma de ambas columnas sea 12, si tienes en una misma fila : 6columnas y 7columnas, esta se desfigura, pues no calza en una misma fila.

Saludos.
No tienes permitido ver los links. Registrarse o Entrar a mi cuenta