Visualizzazione dei risultati da 1 a 7 su 7
  1. #1
    Utente di HTML.it
    Registrato dal
    Dec 2006
    Messaggi
    442

    Pulsanti colorati in menu

    Ho un menu generato da questo codice:
    Codice PHP:
    <?php
    $menus 
    = array('main_menu' => array(
      
    "home"=>"Home",
      
    "chisiamo"=>"Chi siamo",
      
    "attivita"=>"Attività",
      
    "laboratorio"=>"Laboratorio",
      
    "amici"=>"Amici",
      
    "contatti"=>"Contatti"
        
    ),
    "attivita_menu"=>array(
    "concluse"=>"Concluse",
    "inprogramma"=>"In programma"),
    "laboratorio_menu"=> array("lavori"=>"Lavori"),
    "contatti_menu"=>array("dovesiamo"=>"Dove siamo",
    "scrivici"=>"Scrivici"
      
    )
    );
    ?>

    <div id="nav">
    <?php    foreach ($menus['main_menu'] as $key => $menu) {
            
    // scorro il menu principale
    ?>
            <li id="<?php echo $key?>">
            <a href="index.php?pagina=<?php echo $key;
    ?>"><span></span><?php echo $menu ?></a>
    <?php
          
    if (isset($menus[$key."_menu"]))  {
          
    // se esiste una chiave formata da nomevoceprincipale_menu
          // allora esiste un submenu
          
    ?>
          <ul>
          <?php   foreach ($menus[$key."_menu"] as $subKey => $submenu) {
                  
    // scorro subito il submenu
    ?>[*]<a href="index.php?pagina=<?php echo $key?>
    &sezione=<?php echo $subKey?>"><?php echo $submenu?></a>
          <?php   ?>[/list]
          <?php ?>
          
    <?php   }
    ?>
    </div>
    La sezoine corrispondente del CSS è:
    codice:
    #nav {padding:0; margin:0; list-style-type:none}
    #nav ul {margin:0; list-style-type:none; display:none; position:absolute;
    padding:0}
    #nav li {float:left; position:relative; width:9em; padding:0;
    margin-right:1em; font-size:90%; font-weight:bold}
    #nav a:link, #nav a:visited {display:block; text-decoration:none;
    padding:0.4em; background-color:gray; color:white}
    * html #nav a {width:100%}
    #nav ul li {background-color:#F1F5F9; font-size:100%; margin-bottom:-1px;
    margin-top:1px; border-bottom: 1px solid white}
    #nav li:hover ul {display:block; margin-left:1em}
    Mmi piacerebbe creare un effetto grafico per cui i vari pulsanti del menu
    non sono tutti grigi allo stesso modo, ma incrementano progressivamente
    il tono di grigio. Si può fare da dentro PHP?

    Grazie
    M.

  2. #2
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    266
    Si è possibile farlo, ovviamente con javascript o css

  3. #3
    Utente di HTML.it
    Registrato dal
    Jan 2009
    Messaggi
    777
    se vuoi sfruttare appieno il css credo che tu debba mettere una classe differente per ogni colore progressivo...non so se ci sono modi per determinarle con php
    con il php soltanto magari per controllare solo il colore
    dovresti almeno sapere il valore esadecimale del colore iniziale del link
    con class=\"link\" lasci tutte le proprietà che i tuoi link devono avere ad eccezione del colore
    mettiamo il caso che sia #000000
    la struttura del link sarebbe
    Codice PHP:
    echo "<a href=\"bla bla\"  class=\"link\" style=\"color:#000000\">"
    mettiamo che l'ultimo link incrementando il valore esadecimale sarebbe #000010
    quindi
    Codice PHP:
    echo "<a href=\"bla bla\"  class=\"link\" style=\"color:#000010\">"
    dato che l'esadecimale è un valore diverso dal decimale per incrementarlo dobbiamo trasformarlo in decimale incrementare questo e ritrasformare in esadecimale
    Codice PHP:
    //il primo valore link è 000000
    $decimaleprimovalorehexdec(000000);
    //il secondo valore link è 000010

    $numerodilink10;
    $decimaleultimovalore$decimaleprimovalore $numerodilink;

    //stampi i link
    for($i=$decimaleprimovalore$i<=$decimaleultimovalore$i++){
    echo 
    "<a href=\"bla bla\"  class=\"link\" style=\"color:#".dechex($i)."\">";

    credo vada bene
    resta il problema del href
    quello che potresti fare è inserire i link in un array partendo con la numerazione dal valore decimale del valore esadecimale del primo colore per esmpio se il nostro primo esadecimale è 000010 il valore decimale è 10 quindi
    Codice PHP:
    $link= array(10 =>"link1","link2"ecc ecc); 
    in definitiva
    Codice PHP:

    //il primo valore link è 000000
    $decimaleprimovalorehexdec("000000");
    //il secondo valore link è 000010

    $numerodilink10;
    $decimaleultimovalore$decimaleprimovalore $numerodilink;

    $link= array($decimaleprimovalore =>"link1","link2"ecc ecc);
    $testolink= array($decimaleprimovalore => "testo1,"testo2",eccecc);
    //stampi i link
    for(
    $i=$decimaleprimovalore$i<=$decimaleultimovalore$i++){
    echo "
    <a href=\"".$link[$i]."\"  class=\"link\" style=\"color:#".dechex($i)."\">".$testolink[$i]."</a>";

    scrivendo in fretta di sicuro mi saranno sfuggiti degli errori di sintassi
    ovviamente devi adattarlo alle tue esigenze spero di averti dato lo spunto giusto

  4. #4
    Utente di HTML.it
    Registrato dal
    Jan 2009
    Messaggi
    777
    l'unico problema è che quando converti magari sono numeri a meno di 6 cifre e bisogna anteporre tanti 0 quante sono le cifre mancanti...s
    se non sbaglio lo può fare sprintf() questa cosa
    Codice PHP:
    //il primo valore link è 000000
    $decimaleprimovalorehexdec("000000");

    //il secondo valore link è 000010

    $numerodilink10;
    $decimaleultimovalore$decimaleprimovalore $numerodilink;


    $link= array($decimaleprimovalore =>"link1","link2","link3","link4");
    $testo= array($decimaleprimovalore =>"testo1","testo2","testo3","testo4");
    //stampi i link
    for($i=$decimaleprimovalore$i<=$decimaleultimovalore$i++){
    $convert[$i]= dechex("$i");
    if(
    6-strlen($conver[$i]) != 0){
    $diff6-strlen($convert[$i]);
    $convert[$i]= sprintf("%0".$diff."d"0)."$convert[$i]";
    }
    echo 
    "<a href=\"".$link[$i]."\"  style=\"color:#".$convert[$i]."\">$testo[$i]</a>
    "
    ;


  5. #5
    Utente di HTML.it
    Registrato dal
    Dec 2006
    Messaggi
    442
    Oddio.... Certo che per un effetto grafico
    ci vogliono chilometri di codice... Adesso
    faccio degli esperimenti, intanto grazie
    per le esaurienti risposte

    M.

  6. #6
    Originariamente inviato da samiel
    Oddio.... Certo che per un effetto grafico
    ci vogliono chilometri di codice... Adesso
    faccio degli esperimenti, intanto grazie
    per le esaurienti risposte

    M.
    Infatti il motto di jQUERY è scrivere dimeno e fare di piu

  7. #7
    Utente di HTML.it
    Registrato dal
    Jan 2009
    Messaggi
    777
    in fin dei conti in quel codice c'è la conversione in decimale e la costruzione dei link
    dato che mi avevi incuriosito con la tua richiesta ho provato l'ultimo codice che ti ho scritto sul mio sito.....devo dire che tra il primo e l'ultimo link(ne ho messi una 30ina) non è che ci sia questa grande differenza di colore percepibile con l'occhio umano...diverso penso sia se si tratta dello sfondo....
    comunque è stato un ottimo esercizio
    jquery lo sto studiando da poco...

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 © 2024 vBulletin Solutions, Inc. All rights reserved.