pannellino per cambiare colore alle pagine tramite css e JS

User Name

Utente Attivo
17 Mar 2005
42
0
6
ciao a tutti vorrei sapere se conoscete uno script già fatto per ottenere l'effetto come in questo sito:


in alto a destra è possibile cliccare sull'immagine del pennello per far aprire un menu dal quale scegliere il colore da attribuire alla pagina.
inoltre mi sembra di aver capito che il colore si sovrappone ad una immagine griga con una trama. è possibile?
grazie mille

Segnala
 

lukeonweb

Utente Attivo
5 Mar 2003
5.177
10
38
43
Napoli
www.lucaruggiero.it
Lo script per aprire il box è simile a quello che ti mostro in questo esempio di menu:

http://www.menujavascript.org/menu-1/horizontal-menu.html

In questo modo apri il "sottomenu" sovrapponendolo agli elementi HTML che ci sono sopra.

Per cambiare la skin alla pagina è sufficiente che imposti un ID al body:

<body id="CorpoPagina">

e lo usi per accedere dinamicamente attraverso Javascript e cambiare lo sfondo.

Ad esempio il verde:

document.getElementById("CorpoPagina").style.backgroundColor = "#0aaa0a";

Ciao!
 

User Name

Utente Attivo
17 Mar 2005
42
0
6
grazie 1000!!

credo di aver capito e non mi pare neanche difficilissimo...almeno spero!!!

ma secondo te la pagina che ti ho fatto vedere ha un'immagine grigia di sfondo alla quale si sovrappone il colore? se si do un image-background al body + un id corpopagina?

e document.getElementById("CorpoPagina").style.backg roundColor = "#0aaa0a";

dove lo metto? ad esempio scrivo verde e lo linko a onclic"document.getElementById("CorpoPagina").style.backg roundColor = "#0aaa0a";

"

grazie ancora
 
Ultima modifica:

lukeonweb

Utente Attivo
5 Mar 2003
5.177
10
38
43
Napoli
www.lucaruggiero.it
Non credo abbia un'immagine di sfondo, applicano "solo" un effetto fade via Javascript, per questo vedi che il box coi colori si scurisce e si attiva a seconda di eventi come il mouseover o altri (non mi piace molto com'è gestito).

Per altro il box con Firefox si sformatta un po, anche se l'effetto fade funziona.

Fammi sapere ;)
 

User Name

Utente Attivo
17 Mar 2005
42
0
6
non so se ho capito ma te intendi il pannellino dove ci sono i quadratini dell'immagine che rimane trasparente fin quando non ci si va sopra col muose?

a me piace la pagina il corpo pagina che ha quella sfumatura trasversale sul bianco stile sfondo macOSX per intenderci.
che si mantiene a presindere del colore che viene applicato.

quello come si fa?

ehe scusa se sono un po' ciuo!
 

User Name

Utente Attivo
17 Mar 2005
42
0
6
ciao!
ho provato così ma non succede nulla
Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>bg</title>
</head>

<body id="CorpoPagina" style="background-color:#FFFFFF;">






<a href="#" onclick="document.getElementById("CorpoPagina").style.backgroundColor = "#0aaa0a";">verde</a> <a href="#" onclick="document.getElementById("CorpoPagina").style.backgroundColor = "#0000FF";>blu</a>

</body>
</html>

devo mettere qualcos'altro?
grazie
 
Discussioni simili
Autore Titolo Forum Risposte Data
P Aiuto per rendere un Bot Telegram Privato PHP 0
V Query per una somma PHP 2
A Tabella con bottoni per aggiornamento record PHP 6
G Consigli SEO per scrittura e struttura pagine SEO e Posizionamento 5
P Passare solo alcuni parametri a script per CSV PHP 0
A Consiglio per creazione sito web Content Management System (CMS) 0
A Regex per isolare link interni con rel noopener PHP 0
L form immagini per il database PHP 0
S CREAZIONE DI SITO PER CORSI DI FORMAZIONE WordPress 1
I [cerchiamo][retribuito] Grafico/a per stickers Offerte e Richieste di Lavoro e/o Collaborazione 0
R Cercarsi programmatore per GDR PBC Offerte e Richieste di Lavoro e/o Collaborazione 0
L Sessione e array per utenti PHP 0
A Sottoquery con group by per mese MySQL 0
G Appicazione HTML per inserimento dai in Database Access Microsoft HTML e CSS 0
V [Cerco] Socio e Sviluppatore per App PlacesFinder Offerte e Richieste di Lavoro e/o Collaborazione 0
Tuttoinformatico [Cerco] Cerco Staff per Blog Professionale dedicato alla Tecnologia! Offerte e Richieste di Lavoro e/o Collaborazione 0
M user agent per il download di api PHP 0
B Stringa sql per ricerca su più campi Database 1
Cosina Upload multiplo con invio allegati per email PHP 0
P Editor per la realizzazione di siti HTML e CSS 0
M Versione nativa per M1. Photoshop 1
A Aiuto per pagina php PHP 0
M [Cerco] aiutanti per creare sito Offerte e Richieste di Lavoro e/o Collaborazione 4
T [cerco] scrittore/scrittrice per articoli web Offerte e Richieste di Lavoro e/o Collaborazione 5
L Interfaccia grafica per gestire sql server .NET Framework 1
B javascript per problemi con pdf e Safari Javascript 0
R Plugin per Gestire videocorsi a pagamento WordPress 3
Y Vorrei selezionare un colore di sfondo per una pagina web Javascript 0
C media per riga MySQL 1
I Cerca: blogger IT per articoli di prova Offerte e Richieste di Lavoro e/o Collaborazione 0
R Plugin per Registrazione Utente e Pagamento prodotto WordPress 2
M Quando ha l'immagine ingrandita è possibile fare rotazione per ritagliare? Photoshop 0
D modificare questo codice per inserimento in text e non in tabella jQuery 1
U [Cerco ] incremento traffico per il mio sito Vendere e Acquistare pubblicita' online 0
E Monitor per Photoshop Photoshop 0
S Libreria PHP per creare file dwg o dxf PHP 0
T cercasi aiuto per file d1 (open-edge db) Database 0
A [cerco - retribuito] Sviluppatore Php freelance per progetti vari Offerte e Richieste di Lavoro e/o Collaborazione 2
G un tool che trova nuovi clienti per web agency e web developer Offerte e Richieste di Lavoro e/o Collaborazione 2
A Mostrare dati database per pagine PHP 2
R cammino minimo per lista di picking: nodi "imposti" da visitare Programmazione 1
A [Vendo] Articoli per blog e siti ecommerce in ottica seo Offerte e Richieste di Lavoro e/o Collaborazione 0
N Mysql_result per PHP 7 PHP 2
elpirata Query per leggere dati da una tabella mysql e mostrarli a video in base a parametri passati tramite GET PHP 5
E Cambiare lingua in Elements per Mac Mac e Software 2
S WEB APP PER AUTOMATIZZARE TASK INSTAGRAM Annunci servizi di Social Media Marketing 0
G Nuova Idea su come trovare clienti per sviluppo web Discussioni Varie 6
L Aiuto per programma web php/mySQL PHP 2
F INDESIGN: problema esportazione esecutivo per la stampa con foto B/N Webdesign e Grafica 0
C Domini .It per estero Domini 0

Discussioni simili