Navigazione

    Privacy - Termini e condizioni
    © 2020 Search On Media Group S.r.l.
    • Registrati
    • Accedi
    • CATEGORIES
    • Discussioni
    • Non letti
    • Recenti
    • Hashtags
    • Popolare
    • Utenti
    • Stream
    • Interest
    • Categories
    1. Home
    2. Categorie
    3. Coding e Sistemistica
    4. Coding
    5. scrollbar nascosata da fixed
    Questa discussione è stata cancellata. Solo gli utenti con diritti di gestione possono vederla.
    • M
      mr.piter User • 6 apr 2011, 09:05 ultima modifica di

      scrollbar nascosata da fixed

      Ciao a tutti.

      Ho un position fixed a fondo pagina ma questo mi copre la scrollbar orizzontale.

      C'è un qualsiasi metodo per farsi che quando compare la scrollbar perchè la pagina viene ridimensionata questo elemento fixed si sposti un pò piu in alto e non copra la scrollbar? un pò come fa facebook con la casellina della chat.

      0 Miglior Risposta Ringrazia Cita Rispondi

        1 Risposta Ultima Risposta
        Caricamento altri post
        Rispondi
        • Topic risposta
        Effettua l'accesso per rispondere
        • Da Vecchi a Nuovi
        • Da Nuovi a Vecchi
        • Più Voti
         

      • K
        karedas Super User • 6 apr 2011, 12:23 ultima modifica di

        Ciao Mr.Piter,

        Non ho capito esattamente l'esempio, se avresti una risorsa condivisibile sarebbe opportuno.
        In ogni caso potresti lavorare con lo z-index.

        Lo z-index, per darti una descrizione approssimativa, funziona un pò come i livelli di photoshop. Il valore di z-index è numerico e quindi, prendendo due elementi con z-index diverso:

        
        #oggetto_sopra{
        z:index:2
        }
        #oggett_sotto{
        z:index:1
        }
        
        

        Tale clausola non è sufficente poichè devi aggiungere, nelle regole css, un posizionamento absolute/relative/fixed (a seconda della tua esigenza) ad entrambi.

        Avviene quindi che i medesimi oggetti, attraverso lo z-index, "collaborino" tra loro.

        Se quindi inserisci al tuo oggetto "fixed" uno z-index:1, potresti mettere alla tua scrollbar uno z-index:2 (con position:relative;).

        Dovrebbe quindi bastare a far si che quest'ultima rimanga sempre al di sopra dell'elemento a fondo pagina.

        In caso ti rimando a darci una risorsa online, z-index e position sono uno degli argomenti più complessi del css e servirebbe quindi vedere cosa ti servirebbe nello specifico.

        0 Miglior Risposta Ringrazia Cita Rispondi

          1 Risposta Ultima Risposta
        • M
          mr.piter User • 6 apr 2011, 12:42 ultima modifica di

          grazie per esserti interessato.

          allora io ho

          [HTML]
          html,body {
          background:#fff;
          margin:0;
          padding:0;
          height:100%;
          width:100%;
          position:relative;
          overflow:auto;
          z-index:1000;
          }

          #pie {
          background:url(../immagini/pie.png) repeat-x;
          width:100%;
          height:40px;
          position:fixed;
          bottom:0;
          z-index:20;
          display:none;
          }
          [/HTML]

          Ma la scrollbar della finestra rimane sotto..

          il display:none è perchè poi compare tramite javascript.

          0 Miglior Risposta Ringrazia Cita Rispondi

            1 Risposta Ultima Risposta
          • K
            karedas Super User • 6 apr 2011, 15:10 ultima modifica di

            Perchè non devi dare i valori di position e z-index all'html e al body, ma all'oggetto scrollbar.

            0 Miglior Risposta Ringrazia Cita Rispondi

              1 Risposta Ultima Risposta
            • M
              mr.piter User • 6 apr 2011, 15:32 ultima modifica di

              non so di cosa stai parlando..:?

              puoi gentilmente farmi vedere come fare?

              0 Miglior Risposta Ringrazia Cita Rispondi

                1 Risposta Ultima Risposta
              • K
                karedas Super User • 6 apr 2011, 16:50 ultima modifica di
                
                #pie {     background:url(../immagini/pie.png) repeat-x;    
                 width:100%;     
                height:40px;    
                 position:fixed;     
                bottom:0;     
                z-index:20;     
                display:none; 
                }
                
                ```e questo va bene
                
                L'altro devi applicarlo alla scrollbar, ad esempio (non so che id tu gli abbia dato)
                

                #scrollbar{
                position:relative;
                z-index:2000;
                ...
                }

                0 Miglior Risposta Ringrazia Cita Rispondi

                  1 Risposta Ultima Risposta
                • M
                  mr.piter User • 6 apr 2011, 17:28 ultima modifica di

                  scusa ma io non ho un elemento scrollbar.. le scrollbar che devo riuscire a vedere sono quelle della finestra..

                  sarò tardo ma mi sfugge qualcosa.. :?:?:?

                  0 Miglior Risposta Ringrazia Cita Rispondi

                    1 Risposta Ultima Risposta
                  • K
                    karedas Super User • 7 apr 2011, 08:40 ultima modifica di

                    Ahhh...adesso ho compreso!
                    Scusami ancora, pensavo tu ti riferissi ad un oggetto che tu utilizzavi e chiamavi come scrollbar...

                    Avresti mica una risorsa online su cui vedere l'esempio?

                    0 Miglior Risposta Ringrazia Cita Rispondi

                      1 Risposta Ultima Risposta
                    • M
                      mr.piter User • 7 apr 2011, 09:44 ultima modifica di

                      no non ce l'ho..

                      comunque è una pagina bianca con con il css che ti ho scritto.

                      nel body ho messo il div #pie con il css sopra descritto e se io ridimensiono la pagina la scrollbar della finestra viene coperta mentre a me serve che faccia come facebook che quando compare la scrollbar il fixed della chat si sposta un pò piu su e mi lascia il posto alla scrollbar.

                      0 Miglior Risposta Ringrazia Cita Rispondi

                        1 Risposta Ultima Risposta
                      • K
                        karedas Super User • 7 apr 2011, 14:56 ultima modifica di

                        Potresti inserire l'intero codice html + css?
                        Quello che non capisco è cosa tu voglia realmente intendere. La scrollbar di cui mi parli da come ho capito è quella del browser a fondo pagina, ma è impossibile che un div possa uscire fuori coprendo così questa scrollbar poichè sarebbe come far uscire la pagina dal programma stesso (il browser) :?.

                        Insomma se mi metti tutto il codice della pagina vediamo di risolverlo, così lo posso ricreare sul mio pc.

                        Ti chiederei anche a questo punto di dirmi quale browser stai utilizzando e la sua versione. Oppure se questo capita con tutti.

                        0 Miglior Risposta Ringrazia Cita Rispondi

                          1 Risposta Ultima Risposta
                        • M
                          mr.piter User • 7 apr 2011, 15:27 ultima modifica di

                          e invece è così.. non esce dalla finestra però si vede che non calcola la scrollbar come parte della finestra.

                          Praticamente si ferma alla status bar invece che alla scroll bar.

                          [html] <html>
                          <head>
                          <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

                              <link type="text/css" rel="stylesheet" href="css/template.css">
                              
                              <base href="http ://localhost/roald/" />
                              
                              <title>ROALD</title>
                          
                          </head>
                          
                          <body>
                          
                          <div id="pie></div>
                          </body>
                          

                          </html>[/html]il css è quello già postato.

                          0 Miglior Risposta Ringrazia Cita Rispondi

                            1 Risposta Ultima Risposta
                          • K
                            karedas Super User • 8 apr 2011, 07:17 ultima modifica di

                            Non vedo nessun problema e con nessuna tipologia di browser.

                            Tra l'altro non ho capito perchè vedi una scrollbar quando non esiste un contenuto con dimensione fissa (ad esempio un div con width:500px).

                            La scrollbar si attiva unicamente quando il contenuto della pagina html occupi più delle dimensioni della finestra del browser stesso.

                            Ad esempio, se tu avesis un div di 500px e in qualità di utente mi riduci il browser a 450px, allora la scrollbar per necessità appare.

                            In ogni caso l'unico appunto che ho trovato nel tuo codice è la chiusura dell'apice sulla classe richiamata: ```
                            <div id="pie></div>

                            
                            
                            Potresti semmai inviarmi un'immagine, salvandola con lo stamp della tastiera e vedere cosa ti succede.
                            0 Miglior Risposta Ringrazia Cita Rispondi

                              1 Risposta Ultima Risposta
                            • K
                              karedas Super User • 8 apr 2011, 07:31 ultima modifica di

                              Uhm..
                              effettivamente hai ragione ora che ho ricontrollate mi sono accorto del solito problema.
                              Succede unicamente con Internet explorer (addirittura anche con la v.9).

                              Io ho risolto così:

                              [html]
                              <head>
                              ....
                              <!--[if IE]>
                              <style type="text/css">
                              #pie{margin-bottom:18px!important;}
                              </style>
                              <![endif]-->
                              </head>

                              [/html]mi raccomando devi inserire l'intero codice insieme ai commenti stessi **(<!-- e //--> ).

                              **Questo impone unicamente a internet explorer (quaslasi versione visto che il problema vale su tutte) di mantenere la tua scrollbar 18px sopra il piede del browser lasciandoti libera la scrollbar.

                              0 Miglior Risposta Ringrazia Cita Rispondi

                                1 Risposta Ultima Risposta
                              • M
                                mr.piter User • 8 apr 2011, 09:00 ultima modifica di

                                si però così rimane lo spazio anche quando la scrollbar non c'è..

                                0 Miglior Risposta Ringrazia Cita Rispondi

                                  1 Risposta Ultima Risposta
                                • K
                                  karedas Super User • 8 apr 2011, 09:08 ultima modifica di

                                  Ma se invece di fixed, che crea un pò di problemi, utilizzi "position:absolute" per il #pie? che l'effetto dovrebbe essere lo stesso per il tuo caso.

                                  Ovviamente rimuovi la clausola che ti ho proposto poco sopra.

                                  0 Miglior Risposta Ringrazia Cita Rispondi

                                    1 Risposta Ultima Risposta
                                  • M
                                    mr.piter User • 8 apr 2011, 09:23 ultima modifica di

                                    si funzionerebbe solo che il mio intento è di usare javascript per fare la pagina che scorre tramite gli anchor link.. quindi usando position absolute il pie si muove insieme alla pagina mentre con fixed rimane "attaccato al fondo del browser.

                                    0 Miglior Risposta Ringrazia Cita Rispondi

                                      1 Risposta Ultima Risposta
                                    • K
                                      karedas Super User • 8 apr 2011, 09:30 ultima modifica di

                                      Allora potresti utilizzare qualche libreria (jquery ad esempio) che pare abbia già di per se qualcosa in grado di risolvere il problema.

                                      0 Miglior Risposta Ringrazia Cita Rispondi

                                        1 Risposta Ultima Risposta
                                      • K
                                        karedas Super User • 8 apr 2011, 09:38 ultima modifica di

                                        "sohtanaka.com/web-design/facebook-style-footer-admin-panel-part-1/"

                                        Qui c'è un interessante plugin, proprio sull'ispirazione della barra di Facebook.

                                        0 Miglior Risposta Ringrazia Cita Rispondi

                                          1 Risposta Ultima Risposta
                                        Caricamento altri post
                                        Rispondi
                                        • Topic risposta
                                        Effettua l'accesso per rispondere
                                        • Da Vecchi a Nuovi
                                        • Da Nuovi a Vecchi
                                        • Più Voti