Per visualizzare questo contenuto devi accettare di utilizzare i cookie.

MyDigitalia
il digitale usato seriamente

Fissare una div solo verticalmente

Fissare una div solo verticalmente

L'idea mi è venuta avendo una pagina mysql/php in local in cui visualizzo graficamente le vite degli uomini illustri.

la pagina non sta tutta nello schermo, né orizzontalmente, né verticalmente, ma mentre scorrendola solo orizzontalmente vedo la barra con le date (i secoli: 1200, 1300, etc), scorrendola verticalmente, per vedere i personaggi illustri più recenti, non vedevo più la barra con le date e dunque non sapevo in che anni uno era nato e morto.

Così ho cercato a lungo sul web e alla fine ho trovato questa soluzione:

come style
settare la barra che si vuole resti verticalmente fissa, ma orizzobntalmente scorrevole, come fixed
(#barre {position: fixed; width: 2080px;})
come script
aggiungere, nell'head della pagina, questo codice javascript:
<script type="text/javascript">
$(window).scroll(function () {
 if (($(window).scrollLeft())>0) {
  $('#barre').css('left', -($(window).scrollLeft()));
 }
});

$(window).resize(function(){
 if ($(window).width() > 960) {
  $('#barre').css('left', 'auto');
 }
});
</script>

Per richiamare il javascript non occorre alcun "onload", basta però che si linki a jquery.js, ad esempio con
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

Per visualizzare questo contenuto devi accettare di utilizzare i cookie.