modificare il valore dellascroll bar di webkit

napuleone

Utente Attivo
12 Nov 2014
76
0
6
provo a spiegarmi meglio
in testa al mio css c'è questo comando con a seguire alcune prove che non hanno funzionato:

CSS:
    ::-webkit-scrollbar {
    display: none;}

/* ho fatto due prove */
 .scrolla {
          margin:auto !important;
          overflow:scroll !important;
                }
 .scrolla {
          margin:auto !important;
          overflow:auto !important;
                }
ho sempre aggiunto !importante per cercare di passare il comando superiore.

All'interno della pagina ci sono tanti DIV uno solo di questi necessita della scroollbar
ho provato di tutto ma non riesco a bypassare o annullare il comando in webkit
se lo tolgo da debug ovviamente funziona ma viene tolto a tutti e non va bene


HTML:
<div id="conbarre" class="scrolla" >

avete soluzioni per farmi comparire le scollbar solo su questo DIV ? Grazie
 
Ultima modifica:
Per non visualizzare la scrollbar bisogna fare così:
CSS:
overflow-y: hidden;
funziona?
 
Per non visualizzare la scrollbar bisogna fare così:
Mi pare che sia stato chiesto esattamente il contrario: si deve poter visualizzare la scrollbar su un determinato elemento.



Il selettore "::-webkit-scrollbar" fa riferimento proprio allo pseudo-elemento che rappresenta la scrollbar.
La proprietà "overflow" invece è riferita all'elemento in cui potrebbe comparire la scrollbar, ma non agisce direttamente sullo pseudo-elemento scrollbar. Per questo non ottieni alcun risultato utile.
La soluzione più logica è sovrascrivere proprio la regola riferita a quello pseudo-elemento, ma da quel che ho valutato, attualmente la regola applicata in quel modo non è reversibile.

Se puoi modificare la regola principale, una soluzione può essere l'uso di not() in questo modo:
Codice:
:not(.scrolla)::-webkit-scrollbar {
  display: none;
}
 
Ultima modifica:
  • Like
Reactions: napuleone
Mi pare che sia stato chiesto esattamente il contrario: si deve poter visualizzare la scrollbar su un determinato elemento.



Il selettore "::-webkit-scrollbar" fa riferimento proprio allo pseudo-elemento che rappresenta la scrollbar.
La proprietà "overflow" invece è riferita all'elemento in cui potrebbe comparire la scrollbar, ma non agisce direttamente sullo pseudo-elemento scrollbar. Per questo non ottieni alcun risultato utile.
La soluzione più logica è sovrascrivere proprio la regola riferita a quello pseudo-elemento, ma da quel che ho valutato, attualmente la regola applicata in quel modo non è reversibile.

Se puoi modificare la regola principale, una soluzione può essere l'uso di not() in questo modo:
Codice:
:not(.scrolla)::-webkit-scrollbar {
  display: none;
}
il problema sta che non vorrei modificare la regola principale in quanto mi è utile su tutti gli altri DIV la scroll la vorrei solo su questo.
ma da quanto hai scritto mi pare che non sia possibile quindi dovrò desistere.
 
il problema sta che non vorrei modificare la regola principale in quanto mi è utile su tutti gli altri DIV la scroll la vorrei solo su questo.
Scusami, forse non sono stato troppo chiaro, ma il :not() fa esattamente ciò che stai chiedendo.

Hai provato il codice che ho indicato?

In quel caso, modificando la regola principale, gli stai dicendo di applicarla a tutti gli elementi tranne che quelli con classe ".scrolla".
 
  • Love
Reactions: napuleone
GRAZIE grande ha funzionato al primo colpo è perfetto, le hanno proprio pensate tutte.
Ti darei il link della pagina ma mio figlio dice che è una pagina inutile ma io mi ci sono divertito un sacco.
ciao
 
* {scrollbar-color: initial! important; scrollbar-width: initial! important; } * :: - webkit-scrollbar {all: initial! important; } * :: - webkit-scrollbar-button {all: initial! important; } * :: - webkit-scrollbar-track {all: initial! important; } * :: - webkit-scrollbar-track-piece {all: initial! important; } * :: - webkit-scrollbar-thumb {all: initial! important; } * :: - webkit-scrollbar-corner {all: initial! important; } * :: - webkit-resizer {all: initial! important; }
 

Discussioni simili