Avatar billede torbenlund Nybegynder
22. december 2009 - 22:52 Der er 12 kommentarer og
1 løsning

Lille problem med en "Imagemenu"

Hej med jer,

Jeg sidder og roder lidt med en imagemenu, der skal være på forsiden af www.torco.dk, som er en side vi er igang med at opbygge. Den skal senere lægges op på www.mg-sound.dk.

Menuen kan ses her på adressen www.torco.dk/imagemenu/imagemenu/

Jeg vil egentlig blot høre, om der er nogen, der kan hjælpe mig med at få fyldt et par billeder mere på. Et par stykker til ville være super fint. Jeg har naturligvis prøvet at tilføje billederne i koden, men der sker ikke rigtigt noget.

Der er en stump css, hvor billederne tilsyneladende også skal tilføjes, men jeg kan som sagt ikke rigtigt få det til at spille.

Glæder mig til at høre fra en af jer, der har lidt (eller meget) forstand på dette.

På forhånd tak. Og rigtig glædelig jul!

Torben
Avatar billede Slettet bruger
23. december 2009 - 00:30 #1
I filen imageMenu.css er der forskellige linjer som ser ud som denne:

#imageMenu ul li.id_på_div a {
    background: url(images/navn_på_billede.jpg) repeat scroll 0%;
}


Under den sidste af dem tilføjes endnu en (copy-paste) og de to markerede stykker tekst rettes til.

---

I toppen af samme fil findes også disse linjer:

#imageMenu {
    position: relative;
    width: 500px;
    height: 200px;
    overflow: hidden;
}


Det markerede tal rettes til så det passer med antallet af menupunkter.

Så skulle det gerne virke :)
Avatar billede torbenlund Nybegynder
23. december 2009 - 01:07 #2
Hej med dig Jacob,

Fedt med et hurtigt svar!

Jeg har, før du nævnte det, prøvet denne teori, men resultatet er ikke helt som ønsket...

Hvis du kigger på www.torco.dk/imagemenu/imagemenu/ nu, kan du se, at det er som om, at der er blevet indsat et ekstra billede (som også var planen), men billedet er bare helt hvidt, hvilket jeg ikke fatter meget af!?? Prøv at klikke helt til højre, og du vil ramme det hvide billede.

Det billede jeg har indsat hedder prove.jpg ( torco.dk/imagemenu/imagemenu/images/prove.jpg ) og ligner det med mikrofonen. Men hvor det bliver af på siden, ved jeg ikke...?

Måske du har en idé til denne "lille" problematik?

Noget helt andet er, at jeg gerne vil have dem til at åbne i et nyt vindue, når man klikker på dem. Jeg har siddet og rodet lidt frem og tilbage i html koden, men jeg kan ikke få det til at virke, som det skal.

Glæder mig til at høre fra dig igen :)

Torben
Avatar billede Slettet bruger
23. december 2009 - 01:43 #3
Det skyldes noget så simpelt som en slåfejl:

#imageMenu ul li.abstract a {
    background: url(images/abstract.jpg) repeat scroll 0%;
}   
#imageMenu ul li.prove a {
    background: url(images/prove.jpg) repeat scroll 0%;   
}


Dit andet "problem" løses ved at ændre lidt i det lille stykke kode der ligger nederst på siden:

<script type="text/javascript">
    window.addEvent('domready', function(){
        var myMenu = new ImageMenu($$('#imageMenu a'),{openWidth:310, border:2, onOpen:function(e,i){alert(e);}});
    });
</script>


Det markerede stykke kode kan udskriftes med det, du ønsker at der skal ske, når der klikkes på et billede. Og for at få noget kode på banen:

window.open(e, 'popup');

Åbner et nyt vindue med den url der er sat i linket.
Avatar billede torbenlund Nybegynder
23. december 2009 - 02:50 #4
Hej igen Jacob,

Så er vi ved at være ude på de små timer, hva´?! Eller hvad er det, man siger??

Nu er vi skam ved at være der. Du er til super meget nytte, bare at du ved det...

Nu åbner de op i et nyt vindue, men ligemeget hvad jeg skriver her: href="her_skriver_jeg_linket" åbner den op med http://torco.dk/imagemenu/imagemenu/ . Hvordan kan det være??

Jeg vil blive super glad, hvis du kan løse denne lille gåde ;)

Torben
Avatar billede Slettet bruger
23. december 2009 - 11:37 #5
Hej igen

Jeg er da glad for at jeg kan hjælpe :)

Jeg bruger ikke selv MooTools, som dette script er bygget over, men i stedet jQuery. Derfor er jeg ikke helt sikker på, om det jeg har bikset sammen er det mest optimale, men det virker da:

window.open($('imageMenu').getElements('a')[i], 'popup');
Avatar billede Slettet bruger
23. december 2009 - 11:39 #6
Desuden, personligt ville jeg nok fjerne overstregningen af links på din side, da det gør det svært at læse hvad der står.
Avatar billede Slettet bruger
23. december 2009 - 11:41 #7
(Og så er der jo også de 105 fejl :P )
Avatar billede torbenlund Nybegynder
23. december 2009 - 13:13 #8
Hej igen Jacob,

Jeg er også glad for, at du vil hjælpe :)

Jeg har forsøgt at indsætte den lille stump kode, men der sker ikke rigtigt noget. Prøv at klikke på et billede på www.torco.dk - og den åbner det samme vindue. Nemlig: http://torco.dk/imagemenu/imagemenu/ på alle billederne.

Vi ved godt, at der er en del fejl i koden, og det er også planen, at der skal gøres noget ved det. Vi er ikke de helt store kodeeksperter, så det gør det en smule svært.

Mht. overstregningen af links - så er de ikke overstregede her på min pc. Men der kommer en streg under og over, når man holder musen over. Jeg kan godt slå det fra, hvis det er :)

Ser frem til at høre fra dig igen, hvis du snart gider hjælpe mere??

Torben
Avatar billede Slettet bruger
23. december 2009 - 14:11 #9
Ja, der skal jo naturligvis indsættes et link :)

<li class="landscapes"><a href="link/til/side.html">Landscapes</a></li>

Ja, jeg udtrykte mig forkert. Jeg mente faktisk ovenoverstregningen, altså stregen over teksten.

Jacob
Avatar billede torbenlund Nybegynder
23. december 2009 - 14:35 #10
Hej igen Jacob,

Nu har jeg indsat et link til det første billede, men den åbner ikke siden www.torco.dk. Istedet åbner den http://torco.dk/imagemenu/imagemenu/www.torco.dk

Jeg forstår ikke, hvorfor den gør dette, men der er jo nok en forklaring...

Kan du finde fejlen?

Torben
Avatar billede torbenlund Nybegynder
23. december 2009 - 14:38 #11
Hej igen,

Jeg glemte at indsætte http:// forrest

Derfor virkede det ikke...

Jeg tror sgu, at den er der nu!

Torben
Avatar billede torbenlund Nybegynder
23. december 2009 - 14:39 #12
Smider du lige et svar, Jacob?!

Torben
Avatar billede Slettet bruger
23. december 2009 - 15:02 #13
Det var godt at det virkede. Her kommer et svar.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester