[inne][JavaScript][PHP]Podzielenie <ul> przy określonej ilości <li> Opcje

[zafon]

Witam jak w temacie czy istnieje szansa aby podzielić <ul> który zawiera maksymalnie 7 <li> tworzył kolejnego <ul> z listą <li> nie wiem czy dobrze to wytłumaczyłem cały kod który tworzy <ul>, które zawierają <li> wygląda tak :

[PHP] pobierz, plaintext 
  case "prodkategorie":
                        //
                        $NazwaKategorii = Kategorie::NazwaKategoriiId($strona[1]);
                        $NazwaKategoriiSeo = Kategorie::NazwaKategoriiSeoId($strona[1]);
                        //
                        if ( !empty($NazwaKategorii) ) {
                            //
                            $DoWyswietlania .= $tagPoczatek . '<a href="' . Seo::link_SEO( $NazwaKategoriiSeo, $strona[1], 'kategoria') . '">' . $NazwaKategorii . '</a>';
                            //
                            $TablicaPodkategorii = Kategorie::TablicaKategorieParent($strona[1]);
                            //
                            if ( count($TablicaPodkategorii) > 0 ) {
                                //
                                $DoWyswietlania .= '<ul class="ul-podkategorie">';
                                //
                                foreach ( $TablicaPodkategorii as $Podkategoria ) {
                                    //
                                    $DoWyswietlania .= '<li>' .  '<a href="' . Seo::link_SEO( $Podkategoria['seo'], $strona[1] . '_' . $Podkategoria['id'], 'kategoria') . '">' . $Podkategoria['text'] . '</a>' . '</li>';
                                    //
                                }
                                //
                                $DoWyswietlania .= '</ul>';
                                //
                            }
                            //
                            unset($TablicaPodkategorii);
                            //
                            $DoWyswietlania .= $tagKoniec;
                            //
                        }
[PHP] pobierz, plaintext 

[trueblue]

Otwieraj <ul> i zamykaj </ul> w odpowiednim momencie.

A czy czasem nie wystarczy Ci: https://developer.mozilla.org/en-US/docs/We...SS/column-count ?

[zafon]

Zgadza się, ale niestety podzieli to tylko równe części jeżeli nie to brzydko to potem wygląda ;/ . Dzięki za pomoc. Myślisz może że w Jquery może da rade to zrobić?
Chcę wykonać coś podobnego jak jest w https://www.morele.net/

Ten post edytował zafon 22.02.2018, 13:54:47

[trueblue]

Myślę, że jesteś w stanie to zrobić w PHP. Przecież wstawiasz tam <ul> i </ul>. Rób to po prostu co każde 7 pozycji.

[zafon]

Znalazłe takie rozwiązanie tylko nie wiem jak go wykorzystać w wyżej podanym kodzie ?

[PHP] pobierz, plaintext 
<?php
  $data = array(1,2,3,4,5,6,7,8,9,10,11,12);
 
  $break_after = 5;
 
  $counter = 0;   
 $totalNumber = count($data);                    
 foreach ($data as $item) 
 {
if ($counter % $break_after == 0) 
{
    echo '<ul>';
}
 
echo '<li>'.$item.'</li>';    
 
if ($counter % $break_after == ($break_after-1) || $counter ==   $totalNumber-1) {
    echo '</ul>';
}
++$counter;
 
}
[PHP] pobierz, plaintext 

Faktycznie w zupełności column-count poradził sobie nawet przy nieparzystych li

[CSS] pobierz, plaintext 
  .ul-podkategorie{
padding: 15px!important;
-webkit-column-count: 3;
-moz-column-count: 3;
-ms-column-count: 3;
-o-column-count: 3;column-count: 3;
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
-ms-column-gap: 30px;
-o-column-gap: 30px;
column-gap: 30px;
}
  ul.ul-podkategorie li {
-webkit-column-break-inside: avoid;
column-break-inside: avoid;
page-break-inside: avoid;
}
[CSS] pobierz, plaintext