--- title: "DHTML dropdown meny?" type: "forum-thread" url: "https://www.webforum.nu/amne/javascript/160478-dhtml-dropdown-meny" topic: "JavaScript" topic_url: "https://www.webforum.nu/amne/javascript" author: "enrosabanan" published: "2007-05-18T20:53:54.000Z" updated: "2007-05-26T18:20:57.000Z" replies: 18 views: 1550 page: 1 pages: 1 language: "sv-SE" site: "webForum — webforum.nu" rights: "Upphovsrätten till varje inlägg tillhör dess författare." attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/160478-dhtml-dropdown-meny" --- # DHTML dropdown meny? ## #1 — enrosabanan, 2007-05-18T20:53Z Någon som vet var jag kan hitta en bra sådan som jag kan få att fungera..? Jag vill ha en sådan meny som går ner när man håller med musen över, men man ska även kunna klicka där man håller musen. Alltså ska man inte behöva välja något av alternativen som kommer ner i dropdown menyn om man inte vill utan välja själva "huvudmenyn" direkt. Jag är inte så bra på att förklara men ni kanske förstår? :) Permalänk: https://www.webforum.nu/p/160478 ## #2 — nitro2k01, 2007-05-18T22:59Z Kolla [SuckerTree](http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/) Permalänk: https://www.webforum.nu/p/1978995 ## #3 — enrosabanan, 2007-05-19T11:36Z Okej, ska testa det. Tack så mycket :) Permalänk: https://www.webforum.nu/p/1979071 ## #4 — enrosabanan, 2007-05-24T12:13Z Den funkar inte i IE, någon som vet hur man ska få den att fungera? Permalänk: https://www.webforum.nu/p/1980594 ## #5 — dea, 2007-05-24T12:26Z Den fungerar bra i IE6 Permalänk: https://www.webforum.nu/p/1980602 ## #6 — enrosabanan, 2007-05-24T12:45Z Jag har IE7, men grejen är den att det exemplet som finns på den sidan funkar fint men inte när man kopierar in koden på sin egna sida. Permalänk: https://www.webforum.nu/p/1980615 ## #7 — colione, 2007-05-24T12:55Z Kan du visa en sida där du har implementerat den? Permalänk: https://www.webforum.nu/p/1980617 ## #8 — enrosabanan, 2007-05-24T13:04Z Tyvärr har inte jag någon sida ute jag kan visa... Permalänk: https://www.webforum.nu/p/1980621 ## #9 — colione, 2007-05-24T13:35Z Använd mina filer här på wF och länka till den då. :) Permalänk: https://www.webforum.nu/p/1980628 ## #10 — enrosabanan, 2007-05-26T12:56Z Jag tror jag fick upp den nu...? Vore bra med lite hjälp, jag har inte hållt på så länge :) Den är inte positionerad eller något sådant nu heller eftersom jag har ändrat om den så många gånger för att se vad som är fel. Permalänk: https://www.webforum.nu/p/1981389 ## #11 — colione, 2007-05-26T16:44Z Du får gärna länka till den också. Permalänk: https://www.webforum.nu/p/1981458 ## #12 — enrosabanan, 2007-05-26T17:19Z Sorry :P Permalänk: https://www.webforum.nu/p/1981473 ## #13 — colione, 2007-05-26T17:33Z Lyft ur scriptet ur css-filen. Permalänk: https://www.webforum.nu/p/1981480 ## #14 — enrosabanan, 2007-05-26T17:35Z Javascriptet? För på beskrivningen låg det så. Ska man göra en .js fil? Hur gör man det? Permalänk: https://www.webforum.nu/p/1981481 ## #15 — colione, 2007-05-26T17:49Z Det låg nog så, men jag tror du missförstod hur det skulle implementeras. :) ``` Ann-Sofie Larsson -en spegelbild

Välkommen till min portfolio!

Jag heter Ann-Sofie Larsson och jag går första året på John Bauergymnasiet

Ann-Sofie Larsson
-en spegelbild

Rest of content here

``` css-filen: ``` body { background-color: #ffffff; color: #362B44; font-size: 15px; font-family: Arial, Helvetica, sans-serif; margin-bottom: 25px; } #main { position: absolute; left: 125px; top: 290px; width: 750px; height: 330px; background-color: #ffffff; border: solid #362B44 3px; margin-bottom: 25px; padding: 10px; z-index: 1; } #bakom_main { position: absolute; left: 100px; top: 255px; width: 900px; height: 380px; } #spegelbild1 { position: absolute; left: 155px; top: 45px; width: 116px; height: 170px; border: solid #ffffff 5px; z-index: 7; } #spegelbild2 { position: absolute; left: 714px; top: 45px; width: 116px; height: 170px; border: #ffffff solid 5px; z-index: 8; } #bakomspegelbild1 { position: absolute; left: 150px; top: 40px; width: 136px; height: 190px; background-color: #362B44; z-index: 3; } #bakomspegelbild2 { position: absolute; left: 709px; top: 40px; width: 136px; height: 190px; background-color: #362B44; z-index: 6; } #sidnamn { position: absolute; left: 300px; top: 90px; width: 400px; height: 100px; background-color: #ffffff; z-index: 2; } .ann_sofie { font-size: 40px; text-align: center; } .en_spegelbild { font-size: 20px; text-align: center; } .bild_vid_valkommen { width: 100px; height: 200px; float: left; } .valkommen_text { font-size: 20px; } /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .suckertreemenu ul{ margin: 0; padding: 0; list-style-type: none; } /*Top level list items*/ .suckertreemenu ul li{ position: relative; display: inline; float: left; background-color: #F3F3F3; /*overall menu background color*/ } /*Top level menu link items style*/ .suckertreemenu ul li a{ display: block; width: 90px; /*Width of top level menu link items*/ padding: 1px 8px; border: 1px solid black; border-left-width: 0; text-decoration: none; color: navy; } /*1st sub level menu*/ .suckertreemenu ul li ul{ left: 0; position: absolute; top: 1em; /* no need to change, as true value set by script */ display: block; visibility: hidden; } /*Sub level menu list items (undo style from Top level List Items)*/ .suckertreemenu ul li ul li{ display: list-item; float: none; } /*All subsequent sub menu levels offset after 1st level sub menu */ .suckertreemenu ul li ul li ul{ left: 159px; /* no need to change, as true value set by script */ top: 0; } /* Sub level menu links style */ .suckertreemenu ul li ul li a{ display: block; width: 160px; /*width of sub menu levels*/ color: navy; text-decoration: none; padding: 1px 5px; border: 1px solid #ccc; } .suckertreemenu ul li a:hover{ background-color: black; color: white; } /*Background image for top level menu list links */ .suckertreemenu .mainfoldericon{ background: #F3F3F3 url(media/arrow-down.gif) no-repeat center right; } /*Background image for subsequent level menu list links */ .suckertreemenu .subfoldericon{ background: #F3F3F3 url(media/arrow-right.gif) no-repeat center right; } * html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/ padding-top: 1em; } /* Holly Hack for IE \*/ * html .suckertreemenu ul li { float: left; height: 1%; } * html .suckertreemenu ul li a { height: 1%; } /* End */ ``` js-filen: ``` //SuckerTree Horizontal Menu (Sept 14th, 06) //By Dynamic Drive: http://www.dynamicdrive.com/style/ var menuids=["treemenu1"] //Enter id(s) of SuckerTree UL menus, separated by commas function buildsubmenus_horizontal(){ for (var i=0; i