javascript - Onload div slide - Udvikleren.dk - Programmering, webdesign og grafik

Tags: jquery javascript

Bruger #16025 @ 25.07.11 14:56

Det er virkelig så dejligt at kunne få hjælp her af nogle super udviklere som jer!

Kære udviklere!
Jeg ville afprøve et onload() ved body sektionen, så i det at man går ind på forsiden, så slider menuen sig ned til sin plads. Det skal kun ske ved første besøg på forsiden, og så næste gang man besøger forsiden efter at man har lukket siden ned, så gør den det samme igen.

Er der nogle der kan forklare mig hvordan jeg kan gøre dette? Jeg er ikke den bedste til javascript og jQuery, så derfor er det lidt svært for mig at opsætte det. Jeg har endnu ikke noget kode, da jeg har prøvet at søge på nettet

6 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 12 karma

Sorter efter stemmer Sorter efter dato

Bruger #3427 @ 25.07.11 15:18

1.520

nåre okay

jamen det kan du gøre med noget i den her stil

JScript kode

 $(document).ready(function(){
   $("#menu").css({"top": "-100px", "position": "absolute"}).animate({"top": "0px"});
 });

Bruger #3427 @ 25.07.11 15:10

1.520

hej

det du gør er at lave en if der kigger på om brugeren har været på siden før, via en session.
hvis han ikke har det så udskriver du noget javascript der fixer din menu

nu ved jeg ik hvad sprog du bruger, men hvis det er php kan det være noget i denne stil:

PHP kode

 <?php
 session_start();
 if(!isset($_SESSION["first"])){
 $menu_js = '<script type="text/javascript">/* script her */ </script>';
 $_SESSION['first']++;
 }
 ?>
 <html>
 <head></head>
 <body>
   <div id='menu'></div>
   <?php if(isset($menu_js)){ echo $menu_js; } ?>
 </body>
 </html>

Bruger #16025 @ 25.07.11 15:12

442

Hej Kenneth.
Jeg bruger altid PHP, og det der ser sgu godt nok ud. Det vil jeg prøve at teste. Men mit egentlige spørgsmål var det dér med menuen om hvordan man får den til at slide ned

Bruger #16025 @ 25.07.11 15:25

442

#Kenneth
Tusind tak!

Jeg ved godt at det ikke var en del af det oprindelige spørgsmål, men kan du ikke svare mig på hvorfor at addClass() ikke virker?

JScript kode

 $("div#menu a#home").addClass("current");
 
 $("div#menu a#home").click(function(event){
   $("div#menu a#about").removeClass("current");
   $("div#menu a#home").addClass("current");
 });
 
 $("div#menu a#about").click(function(event){
   $("div#menu a#home").removeClass("current");
   $("div#menu a#about").addClass("current");
 });

Jeg ville gerne have den til at når du er på forsiden, så har knappen "Home" en class som hedder "current", og ligeledes hvis man klikker på "Home" sker der det samme. Og hvis man klikker på f.eks. "About" så får den knap en class som hedder "current" og "Home" mister den class, hvis du forstår mig

Eksempel her: link

Grunden til at jeg vælger at spørge her, det er fordi at den alligevel står åbent

Indlæg senest redigeret d. 25.07.2011 16:06 af Bruger #16025

Bruger #13770 @ 26.07.11 15:44

AddClass virker fint.

Men du har lagt en onclick på et link, hvilket vil sige at din menu ændre klasser, og derefter sender du brugeren hen på en ny side hvor dit javascript endnu ikke har kørt.

Nu ved jeg ikke hvordan din menu er lavet, men du kunne gøre noget i stil med dette.

JScript kode

 $(function(){
   $("div#menu a").each(function(){
     if($(this).attr("href") == location.href){
         $(this).addClass("current");
     }
   });
 })

Dette er bare et hurtig eksempel, så du kan ikke bare bruge det uden at tilpasse det til din side.

Hvis du ikke er så god til javascript kan du lave det i din php kode, så risikerer du heller ikke at der er nogle der ser din menu skifte farve(eller hvad den nu gør når den får denne klasse)

Bruger #3427 @ 26.07.11 15:45

1.520

#Kenneth
Tusind tak!

Jeg ved godt at det ikke var en del af det oprindelige spørgsmål, men kan du ikke svare mig på hvorfor at addClass() ikke virker?

JScript kode
 $("div#menu a#home").addClass("current");
 
 $("div#menu a#home").click(function(event){
   $("div#menu a#about").removeClass("current");
   $("div#menu a#home").addClass("current");
 });
 
 $("div#menu a#about").click(function(event){
   $("div#menu a#home").removeClass("current");
   $("div#menu a#about").addClass("current");
 });
Jeg ville gerne have den til at når du er på forsiden, så har knappen "Home" en class som hedder "current", og ligeledes hvis man klikker på "Home" sker der det samme. Og hvis man klikker på f.eks. "About" så får den knap en class som hedder "current" og "Home" mister den class, hvis du forstår mig

Eksempel her: link

Grunden til at jeg vælger at spørge her, det er fordi at den alligevel står åbent

har svaret på det i din anden tråd: http://www.udvikleren.dk/forum/34943/addclass-virker-ikke/

Onload div slide

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler