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:

Fra_23

Utente Attivo
4 Mag 2021
40
4
8
Per non visualizzare la scrollbar bisogna fare così:
CSS:
overflow-y: hidden;
funziona?
 

WmbertSea

Moderatore
Membro dello Staff
MOD
28 Nov 2014
435
73
28
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

napuleone

Utente Attivo
12 Nov 2014
76
0
6
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.
 

WmbertSea

Moderatore
Membro dello Staff
MOD
28 Nov 2014
435
73
28
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

napuleone

Utente Attivo
12 Nov 2014
76
0
6
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
 

akhilex791

Nuovo Utente
7 Set 2022
1
0
1
* {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
Autore Titolo Forum Risposte Data
P php jquery ajax per modificare valore in un databe Ajax 1
M Php+MySql: Estrarre dati da tabella e consentire all'utente di modificare un valore 'in linea' PHP 6
S ricavare valore get e modificare css PHP 3
E modificare il valore di un campo in un array PHP 26
M [cerco webmaster] sito web da modificare Offerte e Richieste di Lavoro e/o Collaborazione 0
G Come modificare un pdf in php PHP 1
Shyson Modificare codice e creare link PHP 0
J Modificare panorami 360 ps 2020 Photoshop 0
napuleone modificare il contenitore di un div Javascript 2
napuleone modificare il contenitore di un div Javascript 1
D modificare questo codice per inserimento in text e non in tabella jQuery 1
C modificare sito in locale con dreamWeaver HTML e CSS 3
T Modificare ruolo utenti in fase di registrazione E-Commerce 0
M modificare un file .XML da database Sql PHP 13
S Modificare intestazione documento pdf con LO Draw Linux e Software 0
felino Radio button e Bootstrap: modificare il colore di default! HTML e CSS 1
Shyson Modificare funzione php PHP 15
W Modificare il Type di un Input box in javascript ovunque si trovi Javascript 0
F Modificare report di etichette di access con vba MS Access 0
D [PHP] Tabella: modificare direttamente i valori PHP 6
P [Woocommerce] Modificare il Bottone Checkout di Woocommerce in base alla categoria di prodotto E-Commerce 10
Q impossibile modificare un file ....... C/C++ 2
C [HTML] modificare la scritta della copyright HTML e CSS 2
G [PHP] MODIFICARE DATI TABELLA CONTESTUALMENTE PHP 6
Y [PHP] [HTML] Modificare i quadranti PHP 1
A [PHP] Modificare campo database in base alla scelta dell'utente PHP 2
W Non riesco più a modificare i dati di una tabella da phpmyadmin MySQL 0
V [WordPress] Come modificare link in tasto menu css WordPress 21
Y Modificare script php PHP 5
G Fullcalendar: modificare colore testo, backgroup e bordi per tutti gli eventi jQuery 3
paloppa Bootstrap.min.css modificare il file HTML e CSS 6
Merlina3377 [PHP] modificare file su form immagine thump PHP 1
G [HTML] Modificare ordine dei div in mobile responsive HTML e CSS 5
pfranco [PHP] Modificare pagina web online PHP 9
Shyson Modificare codice jQuery 0
A [Javascript] modificare il contenuto della barra indirizzi di un browser Javascript 1
asevenx modificare lista elementi togliendo l'elemento selezionato jQuery 1
Kolop "Modificare HTML" HTML e CSS 13
K [ASP.Net] Utilizzare e modificare dati linq ASP.NET 0
G Modificare navbar in base allo scroll jQuery 6
R [Photoshop] Modificare luminosità dei bordi in una foto Photoshop 2
A come modificare gli elementi di una lista e gli editText? Sviluppo app per Android 0
A modificare .jar con classe personalizzata Java 9
Mer556 BLOCCATO nel modificare un sito HTML e CSS 3
T modificare un template html5 HTML e CSS 6
B Modificare sorgente di pagina HTML e CSS 10
napuleone Modificare attributi di una classe con js Javascript 2
C modificare un rss con php PHP 2
L Modificare dati tabella mysql PHP 2
P modificare mappa sito Javascript 0

Discussioni simili