Visualizzazione risultati 1 fino 16 di 16

Discussione: Immagine / illuminazione DIV

  1. #1
    Guest

    Predefinito Immagine / illuminazione DIV

    salve a tutti voi , scrivo questo post per potermi aiutare , non so come fare ciò , mi serve un immagine come questa , una che sia sopra di un corole più scuro dell' imagine , deve essere sfocata , e verso il centro deve mano mano diventare chiara fino a quando non sara del colore originale dell' imagine , per me era una cavolata ma non riesco a falro , se mi potete aiutare , facendomi l' immagine ?

    ah , volevo anche sapere come e il codice per illuminale il div , cioè io voglio un codice che faccia in modo che quando uno ci passa sopra si illumina.

    com' è quel codice ?

    mi potete rispondere a entrambi le domande ?

    vi ringrazio anticipatamente
    Ultima modifica di Salmon : 15-12-2006 alle ore 12.21.36

  2. #2
    Guest

    Question Re: Immagine e DIV..

    Ciao, Salmon . Con photoshop è facile farlo.. però non so quanto scuro . Ti va bene così ?

    ..Originale:
    Modifica 1:
    Modifica 3:
    Modifica 2:

    " volevo anche sapere come e il codice per illuminale il div , cioè io voglio un codice che faccia in modo che quando uno ci passa sopra si illumina. "

    Potresti spiegare meglio la 2° domanda, esistono diversi metodi.. Al interno del "div" che cosa ci devi mettere ? Una immagine, un link o una tabella ? Si deve illuminare l'immagine o solo il bordo ? ecc..

  3. #3
    Guest

    Predefinito

    va bene grazie, senti ma io con quel programma non lo saputo fare , comi si fa con quel programma?

    *****

    Citazione Originalmente inviato da consapevolezza
    Ciao, Salmon . Con photoshop è facile farlo.. però non so quanto scuro . Ti va bene così ?

    ..Originale:
    Modifica 1:
    Modifica 3:
    Modifica 2:

    " volevo anche sapere come e il codice per illuminale il div , cioè io voglio un codice che faccia in modo che quando uno ci passa sopra si illumina. "

    Potresti spiegare meglio la 2° domanda, esistono diversi metodi.. Al interno del "div" che cosa ci devi mettere ? Una immagine, un link o una tabella ? Si deve illuminare l'immagine o solo il bordo ? ecc..
    si deve illuminare tutto il div , hai presente i div che sono presenti nella pagina di filefox , quei link che si illuminano al passagio del mause , vorei tipo quelli

    come il codice ?

    [DS] Non inviare messaggi consecutivi, usa la funzione EDIT del forum...
    Ultima modifica di dementialsite : 15-12-2006 alle ore 16.21.59

  4. #4
    Guest

    Predefinito

    se hai photoshop dovresti anche avere image ready per creare l'animazione del pulsante e il programma oltre a crearti l'animazione ti crea il codice html per il funzionamento del pulsante

    arvezze!!!!!

  5. #5
    Guest

    Predefinito

    si ma come si potra fare a fal illuminale il div al passagio del mause

  6. #6
    Guest

    Predefinito

    l'unica cosa e' animare l'immagine che io sappia non ce'un tag per l'illuminazione,non so dove tu l'hai sentito,
    con imageready lo puoi fare ma creando un rollover con due immagini

    ciaooo!!!

  7. #7
    L'avatar di funcool
    funcool non è connesso Utente storico
    Data registrazione
    05-02-2004
    Residenza
    Qui... Non lì, qui!
    Messaggi
    15,433

    Predefinito

    Sul sito di Firefox non è che si illumina il div (che in realtà è un li), ma viene solo cambiato il colore di sfondo.
    Ecco il menù:
    Codice HTML:
    <ul id="nav-main">
        <li id="menu_products"><a class="current" href="/en-US/products/">Products</a></li>
        <li id="menu_addons"><a href="https://addons.mozilla.org/">Add-ons</a></li>
        <li id="menu_support"><a href="/en-US/support/">Support</a></li>
    
        <li id="menu_developers"><a href="http://developer.mozilla.org/">Developers</a></li>
        <li id="menu_aboutus"><a href="/en-US/about/">About</a></li>
    
    </ul>
    Ecco qui il codice CSS:
    Codice:
    /* header */
    
    #header {
    	height: 38px;
    	position: relative;
    	border-bottom: 1px solid #A1A6B1;
    	background: #33415D url("/img/template/header-background.png") top repeat-x;
    	z-index: 1;
    }
    
    #header h1 { margin: 0;	}
    
    #header h1 img {
    	font-weight: bold;
    	color: #7f7c45;
    }
    
    #header ul {
    	padding: 0;
    	margin: 0;
    	list-style: none;
    	border-left: 1px solid #576178;
    	border-right: 1px solid #1f2635;
    	position: absolute;
    	top: 0;
    }
    
    #header li {
    	float: left;
    	padding: 0;
    	margin: 0;
    }
    
    #header ul span, #header ul a:link, #header ul a:visited {
    	display: block;
    	float: left;
    	padding: 10px 15px;
    	text-decoration: none;
    	border-right: 1px solid #576178;
    	border-left: 1px solid #1f2635;
    	color: #dee0e5;
    	height: 36px;
    	voice-family: "\"}\"";
    	voice-family: inherit;
    	height: 16px;
    } #ignored {}
    
    #header ul li span,
    #header ul li a.current,
    #header ul li a:hover {
    	background: #475470;
    	color: #fff;
    	text-decoration: underline;
    }
    
    #header ul li span,
    #header ul li a.current {
    	text-decoration: none;
    }
    Mattia vi manda a FunCool - Matriz - Directory Gogol - Sfondo rosso per la Birmania
    «Tu mi dai fastidio perché ti credi tanto un Dio!» «Bè, dovrò pur prendere un modello a cui ispirarmi, no?» Woody Allen

  8. #8
    Guest

    Predefinito

    praticamente il tag che hai messo lavora sullo sfondo di tutta la pagina ho solo quello relativo alla posizione dell'immagine?

  9. #9
    L'avatar di funcool
    funcool non è connesso Utente storico
    Data registrazione
    05-02-2004
    Residenza
    Qui... Non lì, qui!
    Messaggi
    15,433

    Predefinito

    Citazione Originalmente inviato da Bluroy
    praticamente il tag che hai messo lavora sullo sfondo di tutta la pagina ho solo quello relativo alla posizione dell'immagine?
    Se stai chiedendo a me, le immagini non c'entrano nulla. E' solo il codice utilizzato per il menù alto di questa pagina.
    Mattia vi manda a FunCool - Matriz - Directory Gogol - Sfondo rosso per la Birmania
    «Tu mi dai fastidio perché ti credi tanto un Dio!» «Bè, dovrò pur prendere un modello a cui ispirarmi, no?» Woody Allen

  10. #10
    Guest

    Predefinito

    ah ok ora ho capito garzie!!!

  11. #11
    Guest

    Wink Re: Per illuminare Testo

    Citazione Originalmente inviato da Salmon
    si ma come si potra fare a fal illuminale il div al passagio del mause
    Se intendi illuminare solo testo , ti propongo 4 soluzioni (molto semplici) che puoi ottenere con i " CSS " :

    Esempio 1 Esempio 2 Esempio 3 Esempio 4 Il codice per l'esempio 1 è il seguente. Parametri in grassetto sono da cambiare come desideri (URL , testo , target , tipo di font , dimensione font , background-image) mentre da quelli in blu dipede "l' illuminazione " del testo - in questo caso io ho scelto il colore nero e il colore bianco , tu puoi mettere altre combinazioni di colori . Il parametro "TEXT-DECORATION" serve per scegliere se sottolineare il testo (link\ visited\ hover) o meno. Il funzionamento di questo CSS si basa sul tag class="d" , dove "d" è un nome a caso .. Nell' esempio 3 , è possibile creare colori differenti per ogni link - poiché cambia class=" " da applicare ad ogni link separatamente . Se invece volevi illuminare le immagini , dopo posterò altre spiegazioni ( non ho ben capito il discorso sui "d i v" ) . .

    Codice:
    <STYLE><!--
    
    	BODY { CURSOR: default; 
    
    	FONT-FAMILY: Arial; 
    
    	BACKGROUND-COLOR: #aaaaaa;
    
    	FONT-SIZE: 18pt; COLOR: black; 
    
    	SCROLLBAR-ARROW-COLOR: #ffffff; 
    
    	SCROLLBAR-TRACK-COLOR: #ffffff; 
    
    	SCROLLBAR-BASE-COLOR: #dddddd; }
    
    
    	a.d:link    {COLOR: #000000; TEXT-DECORATION: underline}
    
    	a.d:visited {COLOR: #000000; TEXT-DECORATION: underline}
    
    	a.d:hover   {COLOR: #ffffff; TEXT-DECORATION: none}
    
    
    //--></STYLE>
    
    </HEAD><BODY background="IMAGE" SCROLL="auto">
    
    <a class="d" href="URL" target="_top"><b>TESTO</b></a>

  12. #12
    L'avatar di bastardofuori
    bastardofuori non è connesso AlterGuru
    Data registrazione
    04-04-2006
    Messaggi
    1,535

    Predefinito

    Citazione Originalmente inviato da Salmon
    si ma come si potra fare a fal illuminale il div al passagio del mause
    Ecco uno script che ti potrebbe servire:

    <script type="text/javascript" language="javascript">
    function high(which2){
    theobject=which2
    highlighting=setInterval("highlightit(theobject)", 30)
    }
    function low(which2){
    clearInterval(highlighting)
    if (which2.style.MozOpacity)
    which2.style.MozOpacity=0.3
    else if (which2.filters)
    which2.filters.alpha.opacity=50
    }

    function highlightit(cur2){
    if (cur2.style.MozOpacity<1)
    cur2.style.MozOpacity=parseFloat(cur2.style.MozOpa city)+0.1
    else if (cur2.filters&&cur2.filters.alpha.opacity<100)
    cur2.filters.alpha.opacity+=10
    else if (window.highlighting)
    clearInterval(highlighting)
    }
    </script>

    Quando poi inserisci l'immagine metti:

    <P style="MARGIN-TOP: 0px; MARGIN-BOTTOM: 0px" align=center>
    <IMG style="filter:alpha(opacity=50);-moz-opacity:0.5;" onMouseover="high(this)" onMouseout="low(this)" src="indirizzo" width="??" border=? img heigth="?" alt="??">


    Spero di essere stato chiaro e utile...

  13. #13
    Guest

    Predefinito

    Citazione Originalmente inviato da consapevolezza
    Se intendi illuminare solo testo , ti propongo 4 soluzioni (molto semplici) che puoi ottenere con i " CSS " :

    Esempio 1 Esempio 2 Esempio 3 Esempio 4 Il codice per l'esempio 1 è il seguente. Parametri in grassetto sono da cambiare come desideri (URL , testo , target , tipo di font , dimensione font , background-image) mentre da quelli in blu dipede "l' illuminazione " del testo - in questo caso io ho scelto il colore nero e il colore bianco , tu puoi mettere altre combinazioni di colori . Il parametro "TEXT-DECORATION" serve per scegliere se sottolineare il testo (link\ visited\ hover) o meno. Il funzionamento di questo CSS si basa sul tag class="d" , dove "d" è un nome a caso .. Nell' esempio 3 , è possibile creare colori differenti per ogni link - poiché cambia class=" " da applicare ad ogni link separatamente . Se invece volevi illuminare le immagini , dopo posterò altre spiegazioni ( non ho ben capito il discorso sui "d i v" ) . .

    Codice:
    <STYLE><!--
    
    	BODY { CURSOR: default; 
    
    	FONT-FAMILY: Arial; 
    
    	BACKGROUND-COLOR: #aaaaaa;
    
    	FONT-SIZE: 18pt; COLOR: black; 
    
    	SCROLLBAR-ARROW-COLOR: #ffffff; 
    
    	SCROLLBAR-TRACK-COLOR: #ffffff; 
    
    	SCROLLBAR-BASE-COLOR: #dddddd; }
    
    
    	a.d:link    {COLOR: #000000; TEXT-DECORATION: underline}
    
    	a.d:visited {COLOR: #000000; TEXT-DECORATION: underline}
    
    	a.d:hover   {COLOR: #ffffff; TEXT-DECORATION: none}
    
    
    //--></STYLE>
    
    </HEAD><BODY background="IMAGE" SCROLL="auto">
    
    <a class="d" href="URL" target="_top"><b>TESTO</b></a>
    interessante quindi io ogni link testuale posso cambiare il colore di base giusto oppure no?

  14. #14
    Guest

    Wink Re: Per illuminare Testo

    Esatto , per ogni link testuale puoi avere il colore ( oppure altre caratteristiche CSS ) "link" , "visited" e "hover" separato e differente dagli altri . .Basta aggiungere class=" " per ogni tag "a href" , e poi scrivere la parte del CSS relativa nel header .

    Un altro codice con il quale si può ottenere lo stesso effetto ( Esempio 5 + Esempio 6 ) è il seguente . Qui puoi cambiare onmouseover e onmouseout direttamente all'interno del tag "a href" senza dover scrivere CSS :

    Codice:
                               <a 
          onmouseover="this.style.color='#dd7733'" 
          onmouseout="this.style.color='#000000'" 
          href="URL1">TESTO1</a> <a 
          onmouseover="this.style.color='#00ccaa'" 
          onmouseout="this.style.color='#000000'" 
          href="URL2">TESTO2</a> <a 
          onmouseover="this.style.color='#0088ee'" 
          onmouseout="this.style.color='#000000'" 
          href="URL3">TESTO3</a> ecc..

  15. #15
    Guest

    Predefinito

    grazie per gli esempi e' interessante cio' che si puo fare con i css

  16. #16
    Guest

    Predefinito

    ok, grazie a tutti voi

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •