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.175
13
38
45
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.175
13
38
45
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
felino Lubuntu 18.04 Requisiti per applicazione console .net core 7.0 Linux e Software 0
M pulsante per aprire una maschera che contiene controllo schede MS Access 0
E Aiuto per query PHP 8
E Il punto di riferimento italiano per Trailers cavalli Discussioni Varie 0
F CERCO Servizi SEO di Qualità per Agenzie di Servizi SEO e Posizionamento 3
D Miglior modo per estrarre le occorrenze di un elemento in un set di più file xml e quindi scrivere il risultato in una tabella Excel o magari in JSON XML 0
A Cerco programmatore/sviluppatore per creare forum Offerte e Richieste di Lavoro e/o Collaborazione 2
R Plugin di base per WordPress WordPress 0
D [COMPRO/CERCO] GUEST POST o scambio link per sito di Spiritualità ed Esoterismo. Vendere e Acquistare pubblicita' online 0
L Suggerimento Pagespeed per non vedenti HTML e CSS 0
M Analisi sito per pulire codice inutile HTML e CSS 1
Paolo69 Risolto reCAPTCHA v2 per ASP Classic ASP 0
M Hosting VPS per server di gioco Minecraft Hosting 0
N Grazie per il benvenuto Presentati al Forum 0
Lino80 [Retribuito] Cerco programmatore php per modifica/inserimento funzione/valori da un plugin importer wordpress Offerte e Richieste di Lavoro e/o Collaborazione 0
R Filtri e plugin per photoshop Photoshop 0
AkTaRuS DIsabilitare il tasto destro tranne che per code e pre Javascript 1
0 [Retribuito] Cercasi programmatore per GdR PbC Offerte e Richieste di Lavoro e/o Collaborazione 0
A Adempimenti per magazine on line Leggi, Normative e Fisco 0
R Recupero di permalink di un sito che è stato eliminato per errore WordPress 5
I aiuto urgente per thunderbird Posta Elettronica 0
A Web master per semplice sito web Offerte e Richieste di Lavoro e/o Collaborazione 2
M [Cerco][Gratuito] Artista/designer per creazione grafica gioco di società Offerte e Richieste di Lavoro e/o Collaborazione 0
M Un saluto per cominciare Presentati al Forum 1
N MAX() + ADD_DATE - per update su Mysql MySQL 0
G Qualcuno conosce questo software per gestire le telecamere IP Cam e Videosorveglianza 0
A [CERCO] Articolista per siti a tema eventi e feste private Offerte e Richieste di Lavoro e/o Collaborazione 0
F Applicazione PHP/MySQL per prenotazioni: limitare il numero massimo di posti prenotabili PHP 20
I aiuto per outlook Posta Elettronica 0
L Script per convertire numeri in parole Javascript 2
J [Cerco] [Collaborazione gratuita] Grafico per piccoli lavori di grafica Offerte e Richieste di Lavoro e/o Collaborazione 0
M Memorizzazione temi per le diverse pagine del sito Javascript 1
otto9due Proteggere file caricati dall'esterno ma renderli accessibili per gli utenti loggati. PHP 4
E Consigli per hosting reseller Hosting 0
T aiuto per trasformare un quiz fatto in JS in un quiz in JQUERY jQuery 0
F Cerco fotografo per sito abiti da sposa Discussioni Varie 2
R [cerco][retribuito] Collaborazione per creazioni loghi ed altro Offerte e Richieste di Lavoro e/o Collaborazione 0
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0
seranto Blocco preventivo e Registro dei Consensi per Cookie tecnici? Leggi, Normative e Fisco 2
D Come estendere la tariffa per Wordpress con Visa? Hosting 1
M Fullcalendar in Codeigniter, un aiuto per la chiamata $ajax ? jQuery 0
N Consigli SEO per il mio sito di web design SEO e Posizionamento 0
P Proiezione di Gauss per grafica su sfera in PVC Photoshop 0
M Sintassi "personalizzata" per mysql workbench? MySQL 0
MarcoGrazia Categorie per settore merceologico di Google SEO e Posizionamento 0
Z PHP.INI - STMP per invio email con PHP Server Dedicati e VPS 0
matteoraggi Local seo per un B&B di Forli SEO e Posizionamento 3
D Ical: Sto realizzando un gestionale per i miei appartamenti di casa vacanza PHP 0
S Teams software per i meeting Windows e Software 0
N Non Autorizzato. Dovresti rimuovere il parametro customize_messenger_channel per visualizzare l'anteprima in frontend. WordPress 1

Discussioni simili