[JS] Ipod-style Drilldown menu

[Duncank]

Ik ben bezig met het werken aan een nieuwe website en daarbij wil ik een zelfde soort menu gebruiken als het menu dat je ziet op deviantart.com (met de categorieen die steeds doorschuiven voor de sub-categorieen).
Dit is hetzelfde soort menu als op de Ipod gebruikt wordt.

Ik heb hier nu het een en ander van gevonden, alle hits op google komen uiteindelijk bij dezelfde site uit: http://www.filamentgroup....pod_style_drilldown_menu/

Ze bieden de code niet aan, maar je kunt m hier wel uit de broncode halen. Dat is wat ik gedaan heb, en ik heb het exact hetzelfde werkend gekregen op mijn eigen site.

http://www.projectfive.nl/test
Hier kun je het zien. Maar ik wil dit menu als gewoon menu voor op een pagina gebruiken, en wil dus niks te maken hebben met die hele drop-down functie.
Ik heb echt geen flauw idee hoe ik dit wegkrijg, heb al wat rondgesnuffeld in de scripts (waarschijnlijk zit t m ergens in menus.jquery.js), maar ik krijg t niet werkend.

Ik ben ook al supertevreden wanneer de drop-down constant uitgeklapt blijft staan, dus direct bij het laden van de pagina al open staat. Dan kom ik er verder ook wel uit.

Hopelijk kan hier mij iemand helpen!

[Noork]

Kun je niet de visibility van je menu default aan zetten in css/screen.css?

[Duncank]

ik denk dat ik ongeveer elke waarde die in de css staat de waarde visibility:visible al gegeven heb... veranderd helaas niets..
Heb dit ook even gecheckt in de menus.jquery.js, hier is er ook niets wat een eventuele wijziging in de css wat visibility betreft ongedaan zou maken.

[Noork]

Het menu wordt ingeladen door $('#categories1').click(function(), kun je dit niet vervangen door $(document).ready(function() o.i.d.

[mcDavid]

Begrijp ik goed dat het enige wat je wilt een grijs vlakje, met wat menu-items, die van kleur verschieten als je er overheen beweegt?

Kun je dat niet beter even zelf maken dan?

-edit-
ohnee je wilt wel het doorschuiven, sorry niet goed gelezen...

[ Voor 17% gewijzigd door mcDavid op 11-12-2008 12:58 ]

[Duncank]

@ Noork,

wanneer ik de document.ready in het bestand toevoeg, veranderd er in eerste instantie niets. Maar wanneer je op het menu klikt, wordt ik gewoon doorgelinkt naar de pagina met de lijst erop (menuNavigator.html), ipv dat het menu uitklapt.

[Noork]

Ik zeg niet dat je het exact zo moet doen. Ik heb daar niet zoveel verstand van. Maar het lijkt me dat je het menu wilt laten zien bij het inladen van de pagina ipv een muisklik op je link. Je kan waarschijnlijk dus iets aan de functie veranderen zodat dit werkt.

[edit]
Ik heb even wat geprutst. Met mijn slechte js kennis heb ik dit ervan gebakken. Het zal misschien niet geheel correct zijn, maar het lijkt hier te werken.

code:

<script type="text/javascript">
        var menuContent = $.get('menuNavigator.html', function(data){menuContent = data});
                    
        $(document).ready(function() {
            var menu2 = new Menu($('#categories1'), {
                content: menuContent, 
                width: 216,
                maxHeight: 300,
                positionOpts: {offsetY: -1},
                callerOnState: 'btnMenuOn', 
                itemHover: 'hover', 
                selectCategories: false,
                topLinkText: 'Alle menu-opties'
                }).create();
        });
        </script>

[ Voor 55% gewijzigd door Noork op 11-12-2008 14:45 ]

[Duncank]

en het blijkt dat met 'jouw slechte js kennis' mijn hele probleem is opgelost! Superbedankt!