• User Attivo •

    Questo è un esempio funzionante con il mio codice h t t p ://gd83.altervista.org/example/
    giusto per dare un'idea di quello che voglio realizzare.


  • User Attivo •

    Ma tu hai chiesto come fare per evitare di ripetere due volte lo stesso codice, non come fare per aumentare l'altezza di un div se viene cliccato. Spiega bene cosa vuoi fare e poi vediamo come farlo. Per aumentare l'altezza di un div, l'oggetto window non ti serve.


  • User Attivo •

    @Francesco Di Caprio said:

    Ma tu hai chiesto come fare per evitare di ripetere due volte lo stesso codice, non come fare per aumentare l'altezza di un div se viene cliccato. Spiega bene cosa vuoi fare e poi vediamo come farlo. Per aumentare l'altezza di un div, l'oggetto window non ti serve.

    Ciao Francesco, si quello che volevo é proprio quello di riscrivere quella parte di codice senza ripeterla.
    In teoria a me non serve aumentare l'altezza del div, ma di aggiungere la classe 'selected' all'attributo href quando l'elemento 'li' supera i 30px di altezza.
    Il menù cliccabile che cambia l'altezza è fittizio, non c'entra con quello che devo realizzare è solo una simulazione per mostrare il funzionamento del codice da me postato.


  • User Attivo •

    Con questo esempio qui forse è più chiaro, in effetti mi sono spiegato proprio male :rollo:

    Però quello che vorrei migliorare è solo il codice da me postato inizialmente,
    il resto non è da calcolare sia perché è solo una simulazione del codice reale e sia perché non ho la possibilità di modificare il sorgente orginale
    il sorgente html e js, ma solo il mio blocco di codice.

    Il tutto funziona correttamente, infatti quando la lista supera i 25px si aggiunge la classe 'Selected' all'attributo href.

    ecco l'esempio :

    h t t p : / / gd83.altervista.org/example2/


  • User Attivo •

    Sono riuscito a realizzare lo script con l'aiuto di Francesco (grazie!),
    come potrei semplificare ancora il codice agendo direttamente sull'elemento li
    senza specificare l'id?

    grazie!

    [HTML]

    function resizeFrame() {
    var frames = []; for (var i = 149, l = 1000; i < l; i++) {
    frames.push(i);}
    $.each(frames, function() {
    var divHeight = $('li#' + this).outerHeight();

    if (divHeight > 30) {   
    

    $('li#' + this + ' > a').addClass('Selected');
    } else {
    $('li#' + this + ' > a').removeClass('Selected');
    }
    });
    }
    setInterval(resizeFrame, 150);

    <ul id="tree">
    <li id ="150"> <a href="#">nameA</a>
    <ul><li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    </ul>
    </li>
    <li id ="250"> <a href="#">nameB</a>
    <ul> <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    </ul>
    </li>

    <li id ="980"> <a href="#">nameC</a>
    <ul><li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    </ul>
    </li>
    </ul>[/HTML]


  • User Attivo •

    Usando come selettore il tag, piuttosto che un id, agisci su tutti i tag. Con $("ul#tree li"), agisci su tutti i LI che sono figli dell'UL con ID "tree".


  • User Attivo •

    @Francesco Di Caprio said:

    Usando come selettore il tag, piuttosto che un id, agisci su tutti i tag. Con $("ul#tree li"), agisci su tutti i LI che sono figli dell'UL con ID "tree".

    Ho provato a modificare il codice in questo modo ma non funziona 😞

    [HTML]
    $("#tree li").each(function() {
    var divHeight = $('li').outerHeight();
    if (divHeight > 30) {
    $('li > a').addClass('Selected');
    } else {
    $('li > a').removeClass('Selected');
    }
    });
    }
    setInterval(resizeFrame, 150);[/HTML]


  • User Attivo •

    Cosa devi modificare, i li che sono sotto #tree, oppure i li che sono sotto l'ul che sta sotto?


  • User Attivo •

    @Francesco Di Caprio said:

    Cosa devi modificare, i li che sono sotto #tree, oppure i li che sono sotto l'ul che sta sotto?

    I tag li che sono sotto che stanno sotto l'ul tree, cioè quelli che nel codice html hanno l'id.


  • User Attivo •

    Ho modificato il codice in questo modo, ma applica la classe 'Selected' a tutti i tag a

    [HTML]
    function resizeFrame() {

    $("ul#tree li").each(function() {       
    
     var divHeight = $('ul#tree li').outerHeight();
    
           if (divHeight > 30) { 
    
               $('ul#tree li > a').addClass('Selected');
    
            } else {
    
                $('ul#tree li > a').removeClass('Selected');
    
            }   
    
    }); 
    

    }
    setInterval(resizeFrame, 50);[/HTML]