2016-04-14 29 views
0

Ich benutze animate.css, um einige einfache Animationen zu meiner Website hinzuzufügen. Ich möchte, dass einige Informationen eingeblendet werden, wenn ein Wegpunkt erreicht wird. Es scheint jedoch, dass die Wegpunktfunktion überhaupt nicht funktioniert.jQuery Wegpunkt funktioniert nicht

jQuery

$('.events-wp').waypoint(function(direction) { 
     $('.events-wp').addClass('animated fadeIn'); 
    }); 

CSS

.events-wp { 
    opacity: 0; 
} 
.events-wp.animated { 
    opacity: 1; 
} 

HTML

<div class="panel-group events-wp" id="accordion"> 

Antwort

0

Es funktionierte dies mit. Ich konnte fadeIn nicht zur Arbeit bringen, aber das würde ich wahrscheinlich in CSS machen. (Ist es Transformation oder Übergang denke ich). Beachten Sie, dass ich den Namen der animierten Klasse von einem Punkt in ein "-" geändert habe. Ich denke, die Punkte haben das JS verwirrt.

var $events = $('.events-wp'); 

$events.waypoint(function(direction) { 
    $events.addClass('events-wp-animated'); 
}); 

Dieses Video ist ziemlich gut https://www.youtube.com/watch?v=5hPVpVtgle4