HTML5 Des animations de toile qui s'animent sur les bords et retournent de façon transparente?

Question

J'ai beaucoup d'éléments différents flottant autour d'une page à des vitesses différentes. Quand un élément quitte le côté droit de la page, il devrait commencer à flotter dans le côté gauche. C'est facile, si l'element.x est plus grand que canvas.width, element.x = -100. Cela le place un peu plus loin donc ça n'a pas l'air nerveux. Mais maintenant, voici le problème, comment puis-je le faire si l'élément quitte le côté gauche de la page? Nous ne pouvons pas dire si element.x < canvas.width parce que certains éléments seront naturellement à l'extérieur de la toile flottante avant.

Merci pour votre aide

Answer 1

Il y a quelques façons d'aller à ce sujet. On veut simplement "déplacer" l'élément de l'autre côté s'il est complètement hors-écran (s'il y a une intersection nulle). Puis le déplacer signifie que vous ne coupez toujours l'écran que d'un pixel.

Un autre est de vérifier "d'où il vient" en gardant une trace de son dernier emplacement ou de connaître sa trajectoire (vous le savez probablement si vous animez). Si cela vient de la gauche et va vers la droite et que vous êtes du bon côté, il faut quitter l'écran et vous devez le déplacer. Mais si elle vient de la gauche et va vers la droite et vous êtes sur le gauche côté de l'écran, vous connaissez son entrée et son OK.