Ho trovato un plugin per jQuery che permette di creare pannelli dentro una pagina web in maniera veramente easy: jsPanel!

Se guardate gli esempi e la documentazione, potete notare che le possibilità sono veramente tante.

C'è anche l'integrazione con la prossima versione di Bootstrap, ed è possibile creare pannelli espandibili, finestre modali, toolbar, menu contestuali, ecc.

Insomma tanta roba.

La necessità è quella di bloccare un div (nel mio caso, ma è fattibile anche per altri componenti) durante lo scroll della finestra.

Quindi, nel momento in cui lo scroll arriva ad una certa altezza, il div si deve bloccare e scorrere con la pagina.

Il CSS di partenza del div in questione non ha nulla di speciale:

.row_col_head { height: 12mm;border-bottom: 1px solid black;background-color:white; }

Per Javascript / jQuery, esistono tantissimi plugin per eseguire operazioni sulle tabelle.

Ma se voglliamo applicare un semplice filtro, ricercando in una input text, non abbiamo bisogno di chissa qualche plugin o libreria.

Partiamo da un HTML del genere (io la riempi tramite PHP, ma è indifferente):

<div class="input-field">
                            <input type="text" id="search_suffix" onkeyup="searchTable('tbl_suffix', 'search_suffix');" placeholder="Search..">
                        </div>
                        <table id="tbl_suffix" class="striped responsive-table tbl_cou">
                            <thead>
                                <tr>
                                    <th>SUFFIX</th>
                                    <th>DESCRIPTION</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php foreach ($query as $var): ?>
                                    <tr>
                                        <td><?php echo $var['mime_suffisso']; ?></td>
                                        <td><?php echo $var['mime_descrizione']; ?></td>
                                    </tr>
                                <?php endforeach; ?>
                            </tbody>
                        </table>

Nelle versioni precedenti alla 5, per suddividere la pagina in più parti, si usavano i frame.

Nella versione 5 dell'HTML, e con l'avvento dei CSS 3, i frame risultano deprecati.

In alcuni casi, però, può risultare comodo avere le stesse funzionalità dei frame, senza doverli usare.

Girovagando ho trovato un plugin per jQuery che fa proprio questo: Splitter!

Versione 2, e responsive, del sito MarziaFerrone.com.

Rispetto alla prima versione è cambiato poco graficamente.