position sidebar laterale a scomparsa e doppia a dx

« Older   Newer »
  Share  
Matt~Skeletron
view post Posted on 10/2/2019, 15:05




Ho un problema con la sidebar. In pratica se uso position: absolute; appare una scrollbar in orizzontale che portandola alla massima destra fa vedere la parte nascosta della sidebar, ma poi se aumento la dimensione della sidebar sborda e non č pių nascosta quando chiusa. Usando il position: fixed; invece, lo script funziona. Essendo che volevo bloccare la sidebar e non farla scrollare con l'intera pagina mi chiedevo come poter risolvere per farla rimanere fissa.

Inoltre avrei bisogno anche di un ulteriore aiuto. Vorrei avere entrambe le side sulla destra. Come potrei fare per spostare la sidebar sx sulla dx cosė da averne due? Posso emulare per due volte la dx?
 
Top
view post Posted on 10/2/2019, 23:53
Avatar

Staff

Group:
ForumFree Staff
Posts:
48,880

Status:


Link del forum?
 
Top
view post Posted on 11/2/2019, 00:21
Avatar

Staff

Group:
ForumFree Staff
Posts:
48,880

Status:


Quindi vuoi che entrambe le sidebar si aprano a destra e mettere il pulsante uno sopra l'altro?
 
Top
Matt~Skeletron
view post Posted on 11/2/2019, 00:42




esatto! E se possibile non farle scrollare con la home, ma rimanere fisso come fa il menų
 
Top
view post Posted on 11/2/2019, 00:44
Avatar

Staff

Group:
ForumFree Staff
Posts:
48,880

Status:


Prova con questo css:
HTML
/* SIDEBAR */
.nb_sidebar {position: absolute; display: block; width: 380px; top: 380px; z-index: 9; text-align: left; background-color: rgba(0, 0, 0, 0.60); border-radius: 5px; border-bottom: 1px solid rgba(255, 255, 255, 0.11); padding: 10px 0; margin: 10px 0 10px 0}

.custom_widget > *:not(#nbs_leftbutton):not(#nbs_rightbutton) {opacity: 0}
.custom_widget {10px 0 10px 0; height: 100%; overflow: auto}
#nbs_leftbutton, #nbs_rightbutton, body.openleft #nbs_leftbutton, #nbs_leftbutton:hover, body.openright #nbs_rightbutton, #nbs_rightbutton:hover, body.openleft .me_left .custom_widget > *:not(#nbs_leftbutton), body.openright .me_right .custom_widget > *:not(#nbs_rightbutton) {opacity: 1 !important}
body.openright .nb_sidebar.me_right {box-shadow: 0 0 5px rgba(0, 0, 0, 0.1)}
body.openright .nb_sidebar.me_right {right: 0}
body.openleft .nb_sidebar.me_left {right: 0}
body.openleft #nbs_rightbutton {display: none}
body.openright #nbs_leftbutton {display: none}

#nbs_rightbutton, #nbs_leftbutton {position: absolute; padding: 3px; top: 90px; left: -180px; display: block; height: 70px; width: 170px; transition: all .5s; z-index: 9; background-color: rgba(0, 0, 0, 0.60); border-radius: 5px; border-top: none; border-right: none; border-left: none; border-bottom: 1px solid rgba(255, 255, 255, 0.11); padding: 10px 0; margin: 10px 0 10px 0; font-family: 'Poppins', sans-serif; font-weight: bold; color: #FFFFFF; font-size: 15px; text-shadow: 0 0 2px rgba(0, 0, 0, 0.45), 0 0 9px rgba(255, 255, 255, .4)}
#nbs_rightbutton:focus, #nbs_leftbutton:focus {outline: 0}
#nbs_rightbutton {right: 335px}
#nbs_leftbutton {right: 335px; top: 0}
.nbs_textclose {text-align: center}
.nbs_textclose a {cursor: pointer}

.nb_sidebar.me_right {right: -380px}
.nb_sidebar.me_left {right: -380px}

.nb_sidebar, .container, .custom_widget > *:not(#nbs_leftbutton):not(#nbs_rightbutton), body.openright .nb_sidebar.me_right, body.openleft .nb_sidebar.me_left {transition: all .5s linear}

Ti ho anche messo due righe per togliere l'altro pulsante quando apri la sidebar, altrimenti veniva confusionario.
 
Top
Matt~Skeletron
view post Posted on 11/2/2019, 01:09




Hai fatto bene! Adesso č apparso, perō come ti dicevo con .nb_sidebar {position: absolute appare una scrollbar in basso che portandola sulla destra fa apparire la sidebar che dovrebbe essere nascosta
 
Top
view post Posted on 11/2/2019, 14:12
Avatar

Staff

Group:
ForumFree Staff
Posts:
48,880

Status:


Una soluzione facile che farebbe inorridire chiunque potrebbe essere:
CODICE
body {overflow-x: hidden}


Altrimenti devo pensare a qualcosa di pių elaborato, ma in questi giorni non ho molto tempo purtroppo.
 
Top
Matt~Skeletron
view post Posted on 11/2/2019, 14:16




tranquillo quando hai tempo ;) nel frattempo lascio il fixed ;)
 
Top
8 replies since 10/2/2019, 15:05   172 views
  Share