login  Naam:   Wachtwoord: 
Registreer je!
 Forum

jquery moet div1 in en div2 uitschuiven (Opgelost)

Offline lau - 06/10/2009 21:57 (laatste wijziging 10/10/2009 00:02)
Avatar van lauHTML interesse Ben net begonnen met jQuery te gebruiken, maar ik krijg het niet voor elkaar om een div uit te laten schuiven NADAT een andere div is ingeschoven.
Voorbeeld te zien op:
Als je op login klikt moet deze div (div heet #expand) inschuiven waarna een andere div met inlogvelden (div heet dan #login) uitschuiven. Maar op dit moment gebeurd het schuiven van beide divs op zelfde moment.
Iemand die een oplossing weet?

4 antwoorden

Gesponsorde links
Offline Stijn - 06/10/2009 22:34
Avatar van Stijn PHP expert Kijk in de broncode van je voorbeeld. Daarin staat volgende code:

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3.  
  4. 	$(".btn-slide").click(function(){
  5. 	  $("#expand").slideToggle("slow");
  6. 	  $(this).toggleClass("active");
  7. 	  $("#login").slideToggle("slow");
  8. 	  $(this).toggleClass("active");
  9. 	  return false;
  10. 	});
  11.  
  12. });
  13. </script>


Je moet blijkbaar ook een class meegeven aan je link waarop geklikt wordt.

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. class="btn-slide"


Als je er nog niet uitkomt, lees de broncode van je voorbeeld eventjes door, het is niet veel.
Offline Richard - 06/10/2009 22:34
Avatar van Richard Crew algemeen
javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. $(function () {
  2.     $('.btn-slide').click(function () {
  3.         $('#expand').slideToggle('slow', function () {
  4.             $(this).toggleClass('active');
  5.             $('#login').slideToggle('slow');
  6.             $(this).toggleClass('active');
  7. 	});
  8.         return false; 
  9.     });
  10. });
Offline lau - 06/10/2009 22:38
Avatar van lau HTML interesse Ik heb de class meegegeven aan de link.
Maar er moet een soort pauze tussen beide bewegingen komen.

Overigens Jexus, wat is er anders aan jouw code t.o.v. de mijne, behalve dat het na de slow een extra function() heeft?
Offline StyxLabs - 08/10/2009 20:28 (laatste wijziging 08/10/2009 20:29)
Avatar van StyxLabs Nieuw lid
javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. $(function(){
  2.     $("#button").click(function(){
  3.         $("#div1").slideUp( 800, function(){
  4.             $("#div2").slideDown( 800 );
  5.         });
  6.     });
  7. });


Div id's spreken wel voor zich neem ik aan ;)
De 800's in het script is het aantal miliseconden voor de animatie.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.167s