• Resuelto danitm88

    (@danitm88)


    Hola a todos, gracias de antemano y os cuento mi caso:

    Mi consulta es sobre esta plantilla de wordpress

    http://livedemo00.template-help.com/wordpress_44951/portfolio/portfolio-4/

    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:

    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!

Viendo 1 respuesta (de un total de 1)
  • Quizas en la estructura de jQuery solo puedas agregar lo siguiente a la funcion getNumColumns(), pero si este codigo depende de otra función de php o las mismas opciones del tema es posible que no funcione solo con esto, lo que hago es agregar :

    else if ($folioWrapper == '5cols') {
    var winWidth = jQuery("#portfolio-grid").width();
    var column = 5;
    if (winWidth<380) column = 1;
    else if(winWidth>=380 && winWidth<788)  column = 2;
    else if(winWidth>=788 && winWidth<1160)  column = 4;
    else if(winWidth>=1160) column = 5;
    return column;
    }
    
    else if ($folioWrapper == '6cols') {
    var winWidth = jQuery("#portfolio-grid").width();
    var column = 6;
    if (winWidth<380) column = 1;
    else if(winWidth>=380 && winWidth<788)  column = 2;
    else if(winWidth>=788 && winWidth<1160)  column = 5;
    else if(winWidth>=1160) column = 6;
    return column;
    }
Viendo 1 respuesta (de un total de 1)

El debate ‘programación jQuery’ está cerrado a nuevas respuestas.