Selectable JQuery

Marco_88

Utente Attivo
4 Dic 2014
150
0
0
Roma
batwebit.blogspot.it
Ciao a tutti ho un dilemma con questa funzione JQuery.
Con il selettore #selectable attivo, il tag <a href> non funziona (non switcha le pagine).

Cosa potrebbe essere?

HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Javascript</title>

<style>
body {
width:960px;
border: solid 2px gray;
margin:auto;
text-align:center;
height:900px;
}

#menu {
width:100%;
height: 100px;
background-color: gray;
}

#menu ul {
list-style:none;
float:left;
width:100%;
margin:0 auto;
}

#menu ul li {
float:left;
width:290px;
height: 70px;
text-align:center;
margin:5px;
line-height: 70px;
}


.stndr {
font-size: 19px;
}


  #feedback { font-size: 15px; }
  #selectable .ui-selecting li{ background: gray; }
  #selectable .ui-selected  li{ background: white;}
  #selectable { list-style-type: none; margin: 0; padding: 0; width: 500px; }
  #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
  #selectable a  .ui-selecting{color:black}

</style>

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

</head>
<body>


<h1>Selectable Menu</h1>

<div id="container">

      <div id="menu">
      
      
      <?php 
      
      switch (isset($_GET['content'])) {
      
      case 'autoveicoli' :
      	///modifico array dei parametri
      	break;
      case 'attrezzature' :
      	//modifico array dei parametri
      	break;
      case 'impianti' :
      	//modifico array dei parametri
      	break;
      	//es. array("value" => ($r["archiviata"] == "Y") ? "SI" : "NO", "align" => "center")

      }
      ?>
      
      
          <ul id="selectable">
          
             <a href ="javascript.php?content=autoveicoli" ><li>Autoveicoli e mezzi d'opera</li></a>
             <a href ="javascript.php?content=attrezzature" ><li>Attrezzature e macchinari</li></a>
             <a href ="javascript.php?content=impianti" ><li>Impianti completi</li></a>
             
          </ul>
          
          
      <script> 

      $(function() {
    	    $( "#selectable" ).selectable();
    	  });

      </script>
      
      </div>

</div>


</body>
</html>
 

Marco_88

Utente Attivo
4 Dic 2014
150
0
0
Roma
batwebit.blogspot.it
Provo a richiedere (e a semplificare). Vorrei realizzare un menu in cui ogni elemento listato (<li>) sia interamente attivo con l'elemento <href>.

Schermata 2015-06-22 alle 17.39.58.png

Grazie
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, io proverei in questo modo
HTML:
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Javascript</title>
        <style>
            body {
                width:960px;
                border: solid 2px gray;
                margin:auto;
                text-align:center;
                height:900px;
            }
            a {
                text-decoration: none;
            }
            #menu {
                width:100%;
                height: 100px;
                background-color: gray;
            }

            #menu ul {
                list-style:none;
                width:100%;
                height: 100%;
                margin:0;
                padding:0;
            }

            #menu ul li {
                float:left;
                width:calc(100% / 3);
                height: calc(100%);
                text-align:center;
                line-height: 100px;
            }

            #menu ul li:hover,#menu ul li.current {
                background-color: white;
            }

        </style>
        <script src="//code.jquery.com/jquery-1.10.2.js"></script>
        <script>
            $(document).ready(function () {
                var get = location.href.split("?");
                if (get.length > 1) {
                    console.log(get);
                    $("#menu a[href='?" + get[1] + "']").parent("li").addClass("current");
                } else {
                    $("#menu ul li:first").addClass("current");
                }
            });
        </script>
    </head>
    <body>
        <h1>Selectable Menu</h1>
        <div id="container">
            <div id="menu">
                <ul>
                    <li><a href="?content=autoveicoli" >Autoveicoli e mezzi d'opera</a></li>
                    <li><a href="?content=attrezzature" >Attrezzature e macchinari</a></li>
                    <li><a href="?content=impianti" >Impianti completi</a></li>
                </ul>
            </div>
        </div>
    </body>
</html>
 
Discussioni simili
Autore Titolo Forum Risposte Data
D Jquery - modifica elemenento onlick jQuery 1
E Problema jquery Success jQuery 2
R jquery che cambia css di un elemento non mi funziona sulla pagina caricata da ajax Ajax 5
E PHP & jQuery PHP 8
P jquery refresh div non funziona Javascript 0
P lanciare script asp (o php) da jquery Javascript 1
T aiuto per trasformare un quiz fatto in JS in un quiz in JQUERY jQuery 0
Z CSS Slideshow senza JS e JQUERY HTML e CSS 2
Z CSS Slideshow senza JS e JQUERY HTML e CSS 2
MarcoGrazia Validazione remota tramite plugin (jquery validate) Snippet Javascript 0
M Come selezionare e deselezionare radiobutton con jquery jQuery 1
M Come validare textarea con jquery jQuery 0
R Aggiornare record mysql con Ajax, jQuery e php Ajax 2
P Funzione jQuery Ajax invio file a php jQuery 1
Cosina Menu fisso copre i titoli quando cliccati nel sommario jQuery Javascript 4
MarcoGrazia jquery validate() controllo checkbox jQuery 2
D assegnare risultato di una jquery ad una text Javascript 2
felino [JQuery] Append dopo ultimo ul li del primo livello jQuery 2
A php metodo post jquery non da mai errore jQuery 4
T problema con select dinamica con jquery Javascript 0
P jquery .load jQuery 10
E Div che scompare con scroll jquery Javascript 0
T script jquery non funziona più dopo il passaggio a MVC jQuery 5
B jQuery - hide & show li items jQuery 13
Y jQuery Animation Switch On Off jQuery 0
claudio_lorenzo [Javascript] aiuto su jquery per calcolo altezze dom Javascript 1
O [Javascript] Conflitto Jquery: forse... Javascript 0
MarcoGrazia jquery validate, necessità di validare almeno un elemento select su due jQuery 1
M inserire i dati ottenuti da una jquery in una tabella già esistente jQuery 1
D Jquery, conflitto tra loro risolvibile? jQuery 7
M Filtrare risultati con valori checkbox passati con jquery jQuery 2
Tommy03 Variabile PHP dentro a JQuery PHP 3
L Problema jQuery validation AJAX (PHP 7) PHP 6
G Campo HTML input file con jQuery jQuery 0
P Jquery event nel foreach php jQuery 3
M leggere con jquery/ajax in una function javascript record di database sql server Javascript 0
A [Javascript] Ajax, Jquery e PHP Javascript 1
trattorino Mentions Auto Suggesting da jquery a php PHP 2
X Problema con jquery e ajax jQuery 2
G Inserzione script nella pagina html per jquery jQuery 8
MarcoGrazia Validazione forum con jquery.validate jQuery 2
Shyson Smoot scrolling jQuery nella pagina jQuery 0
felino [Javascript] [jQuery] Slick Carousel: visualizzare una porzione dell'immagine successiva Javascript 0
L Scelta form con jquery jQuery 1
F [Javascript] Aprire file tramite jquery Javascript 0
R Aiuto Jquery jQuery 1
G [HTML] Jquery e tooltipster's jQuery 5
I Jquery fadeout-fadein html data jQuery 0
trattorino Estrarre Nome Utente jquery div php PHP 9
L jquery e json controllo valori da determinate chiavi - keys jQuery 0

Discussioni simili