Avatar billede langkiller Nybegynder
02. september 2012 - 22:07 Der er 4 kommentarer og
1 løsning

jquery menu - underlig placering af menupunkt

Har en lavet en lille menu bl.a. med noget jquery som egentlig fungerede, men efter at jeg tilføjede det sidste punkt blev det placeret lidt længere nede end de andre knapper. Først når man fører musen hen over knappen og fjerner den igen bliver den placeret i samme højde som de andre knapper..

Her er den knap's html og jquery kode, som IKKE virker ordenligt:
HTML
<div id=\"search\" style=\"width: 55px; border: 0px solid; float: left;\">                                    <a id=\"showhidetrigger\" href=\"#\"><img src=\"pics/design2/search2.png\" border=\"0\" width=\"100%\"></a>
</div>

JQUERY:
$(\"#search\").mouseover(function () {
                                $(this).animate({
                                    height: \"77\",
                                    width: \"77\",
                                    left: \"-=7px\"
                                }, \"fast\");
                            $(\"#searchtext:hidden:first\").fadeIn(\"fast\");
                        });   
                       
                        $(\"#search\").mouseout(function () {
                                $(this).animate({
                                    height: \"55\",
                                    width: \"55\",
                                    left: \"+=7px\"
                                }, \"fast\");
                            $(\"#searchtext\").fadeOut(\"fast\");
                        });



________________________________________________


Og et eksempel på en af de andre knapper som VIRKER:
HTML:
<div id=\"home\" style=\"width: 55px; border: 0px solid; float: left;\">
                                    <a href=\"index.php\"><img src=\"pics/design2/home2.png\" border=\"0\" width=\"100%\"></a>
                                    </div>


JQUERY:
    $(\"#home\").mouseover(function () {
            $(this).animate({
                height: \"77\",
                width: \"77\",
                left: \"-=7px\",
            }, \"fast\");
        $(\"#hometext:hidden:first\").fadeIn(\"fast\");
    });   
   
    $(\"#home\").mouseout(function () {
            $(this).animate({
                height: \"55\",
                width: \"55\",
                left: \"+=7px\",
            }, \"fast\");
        $(\"#hometext\").fadeOut(\"fast\");
    });
Avatar billede januskh Nybegynder
03. september 2012 - 07:06 #1
Hvis du ikke allerede kender det plugin, som findes til firefox, så kan jeg anbefale dig "Firebug" til Firefox. Med det plugin, så kan du "pinpointe" det element på din html side, som ikke reagerer, som du vil havde. Så kan du osse rette direkte i htmlen og på den måde finde ud af, hvad der er galt. IE har ligeledes deres "Developer Tools" (F12), men den er knap så "powerfull".

Alternativt, så læg et link til en side eller lignende, så er det lettere at se problemet end at kopiere det kode, som du har lagt ind.

Held og lykke :)
Avatar billede olebole Juniormester
03. september 2012 - 13:44 #2
<ole>

Umiddelbart ser det ikke ud, som om fejlen ligger i det, du viser. Dog bør du altid være på vagt med hensyn til float, som nok er WWW's mest 'abused' feature nu om stunder.

Float er god til at lave tekstomløb omkring billeder og den slags, men den er ikke god (eller beregnet) til at lade block elementer til ligge ved siden af hinanden. Til det formål er display:inline-block langt mere hensigtsmæssig.

Om det er float (med deraf følgende 'clear-hackeri'), som er skyld i problemet, vad jeg ikke - men det er det eneste potentielle problem, jeg umiddelbart kan se i din kode  =)

Et link ville som sagt gøre det langt lettere at finde fejlen

/mvh
</bole>
Avatar billede langkiller Nybegynder
04. september 2012 - 09:30 #3
Jeg prøvede at rodde lidt med det igen og ændrede id på den fra "search" til "searcha" samtlige steder... af en eller anden grund gjorde det at det rykkede sig på plads, har dog ingen ide om hvorfor :S

@ole: Har også fjernet float igen, da det bare var noget jeg satte ind da jeg sad og eksperimenterede med det.

Men det ser helt fint ud nu, tak for jeres svar..

Hvis jeg husker rigtig samler du ikke points @olebole, så @januskh vil du have dem?
Avatar billede langkiller Nybegynder
11. september 2012 - 11:13 #4
lukker selv
Avatar billede januskh Nybegynder
11. september 2012 - 16:14 #5
Fjong med mig :)
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