Bruno's profileArti e bagagliPhotosBlogListsMore Tools Help
    April 02

    Mary Poppins

    Stiamo per spremere le ultime gocce di sangue dalla rapa. Di cosa parliamo oggi? Parliamo di Mary Poppins.  Vi siete mai chiesti come facesse Mary Poppins a tenere tutta quella roba nella sua borsa? Io non ci dormivo la notte. Ho fatto una piccola ricerca e oggi posso svelarvi il segreto:

    la borsa di Mary Poppins aveva lo scroll!

    Lo scroll è quella barra che trovate alla destra della vostra finestra (dove state guardando? Sto parlando del monitor ) e che vi permette di vedere anche il resto del mio blog che stà più in basso e che adesso non vedete. Oppure è l'effetto che ottengono quelli che hanno l'apposita rotellina sul mouse. Quando scriviamo lunghi interventi (o usiamo caratteri molto grandi) diventa difficile per chi visita il nostro blog distinguere o trovare gli interventi precedenti, i cui titoli si perdono in un mare di parole. Se l'area dei nostri scritti fosse più limitata il problema non ci sarebbe, ma avremmo poco spazio per i nostri pensieri. La possibilità di accedere al codice HTML del nostro editor può risolvere brillantemente la questione.

    Ridimensioniamo il blog

    Tra le cose che possiamo fare quando costruiamo la nostra scatola c'è la possibilità di definirne le dimensioni. Riprendiamo la riga di codice che abbiamo scritto ieri:

    <DIV style="BACKGROUND-COLOR:#ccccff;BORDER:#336699 6px dotted; WIDTH:100%;HEIGHT:100%;">

    Troviamo due parametri che definiscono la grandezza della scatola. WIDTH: (larghezza) e HEIGHT: (che sarebbe altezza, ma la intendiamo come lunghezza in questo caso). Sono entrambi impostati al 100% e questo vuol dire che il nostro testo sarà automaticamente adattato in larghezza, per sfruttare il massimo spazio disponibile sul video, e in lunghezza, per contenere tutto il nostro testo.
    Questa indicazione può essere sostituita da una nostra dimensione utilizzando i pixel invece del percento (es. WIDTH:350px; HEIGHT:500px;). Avremo così una scatola di dimensioni fisse (decise da noi), col relativo problema che non si allunga automaticamente se il nostro testo è troppo lungo. Quando succede questo abbiamo quello che tecnicamente si definisce un overflow. Per caso OVERFLOW: ... ; è il parametro che dobbiamo aggiungere alla riga di codice per rendere possibile la gestione dell'effetto Mary Poppins.

    Anche OVERFLOW: (al pari del tipo di bordo, come dicevamo ieri ricordate?) sfrutta una terminologia convenzionale, ma a noi, in questo contesto basta un solo valore

    OVERFLOW: scroll;

    Questo dice all'editor che per visualizzare il contenuto che supera la dimensione della scatola vogliamo utilizzare le barre di scorrimento, o la rotellina del mouse.

    Comunque, per chi fosse interessato a fare esperimenti, vi scrivo la lista completa dei termini utilizzabili:

    auto
    hidden
    inherit
    scroll
    visible

     

    La nostra prima riga di codice diventera quindi qualcosa di simile:

    <DIV style="BORDER: #0000ff 3px double; OVERFLOW: scroll; WIDTH: 50%; HEIGHT: 170px; BACKGROUND-COLOR: #66ff99">

    Una cosa che si intuiva, ma che non ho mai detto è che dentro una scatola ce ne possono stare altre. Fino ad ora vi ho solo detto di mettere la prima riga di codice in testa al vostro blog e la seconda (il coperchio) in coda. Ma nessuno vi impedisce, una volta fatto questo, di entrare in modalità HTML, individuare una parte di testo che vi interessa e intrappolarla tra due righe di codice di una nuova scatola. E così via.
    Non dimenticate di chiudere sempre il coperchio con </DIV>

    Divertitevi.

     

    Per quanto riguarda i bordi trattati ieri, valerana83 li ha provati tutti. Fate un salto sul suo blog per vederne i risultati. Grazie a valerana83 e a tutti quelli che passano di qua.

     

    Comments (42)

    Please wait...
    Sorry, the comment you entered is too long. Please shorten it.
    You didn't enter anything. Please try again.
    Sorry, we can't add your comment right now. Please try again later.
    To add a comment, you need permission from your parent. Ask for permission
    Your parent has turned off comments.
    Sorry, we can't delete your comment right now. Please try again later.
    You've exceeded the maximum number of comments that can be left in one day. Please try again in 24 hours.
    Your account has had the ability to leave comments disabled because our systems indicate that you may be spamming other users. If you believe that your account has been disabled in error please contact Windows Live support.
    Complete the security check below to finish leaving your comment.
    The characters you type in the security check must match the characters in the picture or audio.

    To add a comment, sign in with your Windows Live ID (if you use Hotmail, Messenger, or Xbox LIVE, you have a Windows Live ID). Sign in


    Don't have a Windows Live ID? Sign up

    ...ehm, grazie per il link... ho fatto tutto, solo che non so inserire il codice...ho provato a piazzarlo dopo OVERFLOW: scroll;, poichè mi sembrava il posto + ovvio, ma è evidente che sbaglio.....mio suggeriresti dove devo metterlo?
    Sept. 10
    ...hoLa, grazie, sono riuscita a mettere lo scroll...unico problema: esiste un modo, non so codici da qualche parte, per cambiare stile dello scroll stesso?, scusami a quanto ho capito te l hanno chiesto in 20000 ma nn vedo risposte...
    mi fai un favore se mi rispondi grazie
    Sept. 10
    Cyndi Crawford
    ........*.........*
    .....*...............*
    ...*....................*
    ..*.....................*
    .*........................*.........*....*
    *.........................*...*..............*ciao passavo di qui!
    .*.........................*...................*
    ..*.........................*................*il tuo blog è veramente karino!
    ...*.......................................*
    .....*..................................*se ti va passa nel mio
    ........*...........................*
    .........*......................*e lascia una traccia!
    ...............*...............*
    ..................*..........*
    .....................*.....*
    ......................*..*
    ........................*
    ........................*
    .......................*
    ........................*
    .........................*
    .............................*
    ...............................*
    .................................*  baci8 Roxanne!!
    ..............................*
    .........................*
    ...........................*
    .........................*
    .......................*
    ..........................*
    .............................*
    .............................

    _______________.OO.__________
    ________________.OOO.____________.O. * .* .
    ________________.OOOO.______-.OOO. * .* ..
    ________________.OOOOO._-.OOOO. * .* ..
    _______________.OOOOOOOOOOO. * . * . *
    __________-.OOOOOOOOOOOOO. * .* ..
    _____.OOOOOOOO0000000OOOO. * . * . * .
    __________-.OOOOOOOOOOOOO. * . * . * ..
    _______________.OOOOOOOOOOO. * . * . *
    ________________.OOOOO._-.OOOO. * . *. *
    ________________.OOOO.______-.OOO. * .* ..
    ________________.OOO.____________.O. * . *..
    ________________.OO.__________
    ________________.O.__________
    Jan. 24
    aiutoooooooo stò impazzendo.. non riesco a rendere la barra dello scroll invisibile :( aiutami ti prego non la voglio bianca.. complimentissimi per lo space mi ha aiutato tantissimo è stupendo.. ti lascio la mia mail se ti va rispondimi grazie rory_91@hotmail.it
    Jan. 10
    Picture of Anonymous
    Steve wrote:
    Grazie per lo scroll fatti un giro nel mio blog
    Aug. 11
    Maria Piawrote:
    ciao......
    grazie tante per il tuo intervento..
    senza i tuoi consigli non ce l'avrei mai fatta....
    July 12
    Ciao, a me lo scroll orizzontale rimane bloccato. Dove sbaglio?
    Il codice che inserisco è esattamente quello dell'esempio (ma con testo diverso naturalmente, molto più lungo in orizzontale).
    Il problema può dipendere dal fatto che c'è una tabella?
    Feb. 8
    Picture of Anonymous
    Hey_lyla_1 wrote:
    OddioOoOooo quante cose ci sono qua dentroo sembra il paradisOoOo!
    ^^ cmq...cerkero di seguire le tue indicazioni =)
    Anke se sono al quanto imbranata ih
    buona serata ila*
    Jan. 26
    Picture of Anonymous
    ₪Vignos₪ wrote:
    ciao..complimenti x il tuo blog.
    volevo chiederti se potevi dirmi il codice html x mettere dentro uno scoll un'immagine,naturalmente presa da un link.
    risp sulla mia mail.
    grazie mille.
    ciao.
    Jan. 16
    Picture of Anonymous
    _Rubia_Caliente_1 wrote:
    ciao, io non so come ridimensionarlo, mi si vede tutto spostato a sinistra ed è piccolino uffi!
    se vuoi ti do il mio contatto msn oppure rispondi nel mio blog se ti va. grazie infinite.
    Dec. 29
    Picture of Anonymous
    lihoincontratinchattepoi wrote:
    bene scopro finalmente di il tuo blog ne ho sentito tanto parlare....ed ora ho la certezza di quello che si dice...complimenti..!
    il mio problema e' che sto proprio a zero con queste cose..comincero' a studiare...!
    sara' il tuo blog a farmi da giuda..
    grazie..:)
    APEREGINA
    Dec. 9
    Picture of Anonymous
    Amythevampire wrote:
    Ma tu..sei da santificare ^_________^


    GRAZIE GRAZIE GRAZIE


    Viola
    Oct. 19
    Picture of Anonymous
    4639Marco wrote:
    ci sono riuscito nn serve +
    Oct. 3
    Picture of Anonymous
    4639Marco wrote:
    non o capito, sono riuscito a metterla la barra soltanto nn o capito dove si scrive il testo per farlo diventare dentro come fai te.
    se mi devi risponder fallo nel mio blog sull intervenyto che vuoi
    ciao
    Oct. 3
    Picture of Anonymous
    Antonella4511 wrote:
    GRAZIEEEE
    CE L HO FATTA ANCHE CON LO SCROLL

    ALL INIZIO NN AVEVO CAPITO DOVE INSERIRE LA RIGA.. è OVVIO CHE BISOGNAVA METTERLA NELL INTERVENTO (MODIFICA SPAZIO PERSONALE, BLOG, MODIFICA INTERVENTO E ANDARE IN HTML.. ) SEMBRA UN BANALITà MA L UNICO PICCOLO OSTACOLO è STATO QUELLO
    PER IL RESTO è UNA FIGATA.. BASTA COPIARE E INCOLLARE..
    SMACK SMACK
    BBRAVISSIMO
    Oct. 3
    Picture of Anonymous
    simo90thebest wrote:
    ciao bruno...volevo solo dirti ke ho creato un intervento con lo scroll invisibile...non so se ti possa interessare cmq involontariamente è uscito così e lo trovo molto bello!!!!se è una cosa nuova e t interessasse ti posso passare l HTML dello scroll trasparente
    Sept. 12
    Picture of Anonymous
    jacaranda188 wrote:
    non vorrei disturbarti, ma non riesco...
    volevo mettere 2 brani di un libro con diversi colori e bordi,in uno stesso intervento, ma nonostante molteplici tentativi ho dovuto arrendermi
    quando tento di fare la seconda "scatola", pur tornando in HTML, la stringa si piazza nel post normale... ho provato almeno 6 maniere diverse, inutilmente.
    La stessa cosa mi succede con l'orologio.. parto da HTML, e quando torno in normale non si vede nulla e da HTMLè sparito tutto.
    DOVE SBAGLIO? GRAZIE
    Aug. 13
    Picture of Anonymous
    LadyLùcy wrote:
    ciao! complimenti ho capito come si fa! solo ke nn so i codici dei colori..... potresti aiutarmi?? spero in una tua risposta :*
    July 10
    Picture of Anonymous
    STEO_TNT wrote:
    ciao...ho una domanda forse un po' troppo incasinata da farti.... si può mettere uno scroll con dentro un sito?magari il blog di un'altra persona? se si quali sono i codici? prima mi devo costruire lo scroll...e poi il codice per il sito?bhòòò...sei tu l'esperto...la mia è una proposta... ^_^ ciaoooooooo
    July 3
    Picture of Anonymous
    sassyzullo wrote:
    scusa ma come faccio a scaricarmi hedit
    June 13

    Trackbacks (1)

    The trackback URL for this entry is:
    http://bberti.spaces.live.com/blog/cns!7E4B1E86FC5DD69C!743.trak
    Weblogs that reference this entry