Visualizzazione dei risultati da 1 a 9 su 9
  1. #1
    Utente di HTML.it L'avatar di moomo
    Registrato dal
    Jul 2007
    Messaggi
    227

    Layout dinamico a più scelte di colore!

    Ciao raga, vi volevo porre una domanda, ho creato un layout con i div in maniera dinamica, questi div hanno come sfondo delle immagini che messe a sieme danno il layout, per capirci ho fatto le sezioni con photoshop e lo esportate.

    La domanda è questa, lo stesso layout l'ho fatto in due colori blu e verde, posso fare nel mi sito due link uno con la scritta blu e l'altro verde, che cliccando su di essi si può cambiare l'immagine di scondo di tutti i div cambiando il colore del layout.

    Penso si faccia con dei comandi javascrip, qualcuno potrebbe indicarmi dei tutorial o come si potrebbe fare, grazie per la cortese attenzione moomo.

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Vedi se questo può aiutarti http://javascript.html.it/script/ved...ine-di-sfondo/ nella stessa sezione trovi anche i tutorial.
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    quello che richiedi tu è uno style switcher, che in base alla selezione dell'utente imposta al tuo documento html il corrispondente file.css, uno per ogni colore di layout.
    Per far questo puoi utilizzare javascript o un linguaggio server side con cookie o sessioni.
    Visto che siamo sul forum javascript ti posto un esempio preso da Alistapart: styleswitcher.js
    in realtà ho realizzato uno script simile (ispirandomi a un altro metodo) per il mio blog che non ho ancora pubblicato: solo che usa un solo foglio di stile e usa solo classi css per modificare i colori e la grafica del template (link). Solo che il mio script l'ho sviluppato con prototype, quindi devi includere anche questa libreria. Se vuoi ulteriori informazioni chiedi.

  4. #4
    Utente di HTML.it L'avatar di moomo
    Registrato dal
    Jul 2007
    Messaggi
    227

    grazie mille.

    grazie mille questo tutorial mi è stato molto utile, mi servirebbe però un esempio da scaricare che non cambi lo sfondo, ma lo sfondo delle tabelle o div del mio layout.

    ad esempio ho il sito e volgio cambiare solo la parte superiore di un altro colore e immagine, ma l'esempio di prima non funzione con firefox?

    ancora grazie mille ragazzi.

  5. #5
    Utente di HTML.it L'avatar di moomo
    Registrato dal
    Jul 2007
    Messaggi
    227

    ?

    si potrebbe avere un esempio come il tuo blog ... in internet ad esempio?

    grazie mille lo stesso

  6. #6
    innanzitutto il tutorial di Alistapart del link che ti ho postato mi sembra abbastanza semplice da provare; comunque anche su html.it c'è un articolo in merito.
    Se invece volessi utilizzare la mia versione ti ho preparato una demo con uno zip funzionante da scaricare.

  7. #7
    Utente di HTML.it L'avatar di moomo
    Registrato dal
    Jul 2007
    Messaggi
    227

    solo una cosa

    ciao grazie, solo una cosa non ho capito nell'esempio che ho scaricato, cioè non trovo i pulsanti che fanno cambiare colore, cioè nella pagina ci sono ma quando apro dremwever non ci sono?

    grazie mille.

  8. #8
    non trovi i bottoni in dreamweaver semplicemente perchè li ho inseriti con javascript e di fatto non sono presenti nell'html. per farlo devi guardare il codice di protoswitcher.js, c'è una funzione chiamata cssButton() che li inserisce.
    per semplificarti le cose puoi anche eliminarla e inserire i bottoni direttamente nell'html.
    per fa questo devi eliminare le seguenti righe nel javascript che ti ho indicato
    Codice PHP:
    function CssButton() {
    //codice bla bla bla ....

    e sempre nello stesso file elimina (alla fine del listato) la chiamata a CssButton() dentro a function Switcher().

    poi nell'html dell'esempio inserisci il codice che prima veniva generato da javascript:
    Codice PHP:
    <div id="options">
    <
    h2>CSS</h2>
    <
    ul id="option_color">
    <
    li id="blue"><span>blue</span>
    <
    li id="black"><span>black</span>
    <
    li id="red"><span>red</span>[/list]
    </
    div

  9. #9
    Utente di HTML.it L'avatar di moomo
    Registrato dal
    Jul 2007
    Messaggi
    227

    ok

    ok grazie, se ho problemi ti faccio sapere.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.