Problemstilling
Skal ha to to anchorlenker plassert inni en egen div, og igjen i en uordnet liste, som vist nedenfor i kodeutsnitt 1. Her skal grid2-1-1 være aktiv ved sidelastning. Disse to lenkene skal toggle mellom to forskjellige div som er innenfor en annen div med id grid2-2. Innenfor grid2-2 er det to diver, grid2-2-1 og grid2-2-2. Se kodeutsnitt 2 for dette.
Lenkene i kodeutsnitt 1 skal veksle mellom disse to boksene (grid2-2-1 og grid2-2-2). Og dette har jeg forsåvidt fått til ved å benytte scriptet vist i kodeutsnitt nummer tre. Men poenget er at jeg ønsker en mer glatt veksling mellom disse to divene, og samtidig skjule en tredje div skjules med id grid3 når grid2-2-2 aktiveres. Da grid2-2-2 er større en grid2-2-1.
Om mulig skal også parent LI til anchortaggen skifte ID når achorlenke innenfor klikkes.
Er det noen som kan hjelpe meg med dette? Sitter realt fast. Send gjerne en melding for å se en demo av slik det fungerer nå.
Kodeutsnitt 1
Kodeutsnitt 2
Kodeutsnitt 3
Håper noen har peiling og mulighet til og hjelpe.
Skal ha to to anchorlenker plassert inni en egen div, og igjen i en uordnet liste, som vist nedenfor i kodeutsnitt 1. Her skal grid2-1-1 være aktiv ved sidelastning. Disse to lenkene skal toggle mellom to forskjellige div som er innenfor en annen div med id grid2-2. Innenfor grid2-2 er det to diver, grid2-2-1 og grid2-2-2. Se kodeutsnitt 2 for dette.
Lenkene i kodeutsnitt 1 skal veksle mellom disse to boksene (grid2-2-1 og grid2-2-2). Og dette har jeg forsåvidt fått til ved å benytte scriptet vist i kodeutsnitt nummer tre. Men poenget er at jeg ønsker en mer glatt veksling mellom disse to divene, og samtidig skjule en tredje div skjules med id grid3 når grid2-2-2 aktiveres. Da grid2-2-2 er større en grid2-2-1.
Om mulig skal også parent LI til anchortaggen skifte ID når achorlenke innenfor klikkes.
Er det noen som kan hjelpe meg med dette? Sitter realt fast. Send gjerne en melding for å se en demo av slik det fungerer nå.
Kodeutsnitt 1
HTML:
<div id="grid2-1">
<!--- Togglemenu --->
<ul class="toggle">
<li class="current" id="grid2-1-1"><a href="#grid2-2-1"><span>Allerede bruker?</span></a></li>
<li id="grid2-1-2"><a href="#grid2-2-2"><span>Registrer deg nå</span></a></li>
</ul>
<!--- /Togglemenu --->
</div>
Kodeutsnitt 2
HTML:
<div id="grid2-2">
<!--- G2-2-1 --->
<div id="grid2-2-1" class="code">
Innlogging
</div>
<!--- /G2-2-1 --->
<!--- G2-2-2 --->
<div id="grid2-2-2" class="code">
Registrering
</div>
<!--- /G2-2-1 --->
</div>
Kodeutsnitt 3
Kode:
$(function(){
var toggles = $('.toggle a'),
codes = $('.code');
toggles.on("click", function(event){
event.preventDefault();
var $this = $(this);
if (!$this.hasClass("active")) {
toggles.removeClass("active");
$this.addClass("active");
codes.hide().filter(this.hash).show();
}
});
toggles.first().click().slow();
});
Håper noen har peiling og mulighet til og hjelpe.