Hirdetés

Keresés

Új hozzászólás Aktív témák

  • ferensz
    senior tag

    Na, sorry, csak most tudtam megnézni a kódodat rendesen.
    Végre egy érdekes kérdés!

    a következőket érdemes használni:
    - CSS class-ok a JavaScript-kódba beégetett stílusváltoztatások helyett, tehát osztályok hozzáadása, elvétele, a jQuery-s addClass, removeClass, hasClass plain JS-ben történő megvalósításával, amire itt van code snippet:
    http://www.openjs.com/scripts/dom/class_manipulation.php
    - ha alapból van mondjuk egy list-collapsed osztály az összecsukott listán, ami display:none-ra állítja azt, és van külön egy list-expanded osztályod, ami pedig display:block-ra állítja, és ebben a sorrendben következik a CSS-kódban is egymás után, akkor elég csak hozzáadnod, illetve elvenned a list-expanded osztályt, de mondjuk ez nem teljesen foolproof megoldás (más is módosíthatja az osztályok sorrendjét, láthatóságát), ezért érdemes mindig elvenni a list-expanded osztályt, ha össze akarod csukni, és hozzáadni a list-collapsed osztályt (ez így nem olyan szép a kódban, mert egymás után van, meg plusz függvényhívások, de azért nem katasztrófa)
    - event.preventDefault, hogy a # hreffel egyenlő linkeket ne akarja követni a böngésző (ne ugorjon a lap tetejére)
    - event.stopPropagation, hogy megakadályozd az esemény felszivárgását (bubbling up) a DOM-fában (pl. a valós linkre kattintva nem kell lenyílnia a listának)

    Ez alapján módosítottam a kódodat:
    http://jsfiddle.net/Sk8erPeter/a63q7/

    Remélem, így már sikerül, kommenteztem a kódot, ha valami mégsem teljesen világos benne, kérdezz vissza nyugodtan.

    Nagyon szépen köszönöm a segítségedet, de szombatra el kellett készülnöm vele, így jquery accordionnal oldottam meg végül a dolgot, de tanulásképpen áttanulmányozom a kódodat :R

  • ferensz
    senior tag

    Rakj fel légyszi egy példát jsFiddle-re vagy JSBinre, úgy több az esély, hogy debuggoljuk.

    Itt van a JSBinre felpakolva. Ha az adott link neve elé kattintasz, akkor lenyílik az "almenü". Nekem azt kellene valahogy elérnem, hogy ha nincs URL megadva az adott linkhez, akkor nyissa le az alatta lévő childokat, ha van URL-je és child elemei is, akkor az URL-re navigáljon, ha pedig nincsenek child elemei, de URL-je igen, akkor is navigáljon oda.

  • ferensz
    senior tag

    Sziasztok!

    ASP.NET-ben fejlesztek egy vertikális menüt, aminek az elemeit egy xml-ből szedem. Amikor megvan a fám, hogy melyik menü alatt milyen almenü helyezkedik el, akkor egy netről lesett javascript a kellő helyekre span-eket pakol be, hogy lenyitható legyen az adott menüpont. A problémám az lenne, hogy a linkem előtt látható spanre kattintva szépen le is nyílik a kellő rész, viszont nekem az kellene, hogy magára a linkre kattintva nyíljon le ami alatta van.

    Tudom, hogy egy kicsit kusza, de most szaladtam bele először ilyenbe.

    A javascript, amit felleltem:

    this.sitemapstyler = function(){
    var sitemap = document.getElementById("sitemap")
    if(sitemap){

    this.listItem = function(li){
    if(li.getElementsByTagName("ul").length > 0){
    var ul = li.getElementsByTagName("ul")[0];
    ul.style.display = "none";
    var span = document.createElement("span");
    span.className = "collapsed";
    span.onclick = function(){
    ul.style.display = (ul.style.display == "none") ? "block" : "none";
    this.className = (ul.style.display == "none") ? "collapsed" : "expanded";
    };
    li.appendChild(span);
    };
    };

    var items = sitemap.getElementsByTagName("li");
    for(var i=0;i<items.length;i++){
    listItem(items[i]);
    };

    };
    };

    window.onload = sitemapstyler;

    Ha esetleg lenne valakinek valami ötlete, hogy hogyan lehetne megoldani a bajomat, azt nagyon szépen megköszönném.

Új hozzászólás Aktív témák