Комментарии:
Thank you for this tutorial because it is amazing! Question: is there a way to control the threshold for when an animation happens? That is, when intersectionObserver spots an intersection, is there a way to control at which distance on the page to spark the animation?
ОтветитьHi, the tutorial is really great, but i have a problem, in main js when I write Vue.directive('scrollanimation', ScrollAnimation); and add v-scrollanimation, on browser my project disappears, there is just nothing, it just becomes white, I do not know why it happens. I hope you know the answer.
ОтветитьWhat if I want to add it to multiple instances of the same section or component, it's only observing one of them
ОтветитьGawd
I needed this
Hi, i wanted to thank you because I'm pretty new at this and I've found this video really valuable.
ОтветитьIs it right to use vanilla js in vue please reply
Ответитьwhere is the link of this project on git???
ОтветитьThank you, I like thia method no to hard and use native js.
ОтветитьHi! I have a problem, I don't know if you can help me.
For some reason the images are cut off or flickering before animation, how could I solve it
Does this work with vue3?
ОтветитьПривет из России и спасибо большое, помог разобраться!
ОтветитьHello Webnoob. Have you got any idea how to make this work in Vue 3?
Ответитьvery well done, man. thanks
Ответитьhmmm niiiiiice tutorial thank u :)
ОтветитьPlease continue making vue videos
Ответитьare u german? i can literally hear it
ОтветитьThx, hopeful stuff
ОтветитьHi i met some prob when i use in Nuxt.js, its keep showing IntersectionObserver is not defined, can u help me?
ОтветитьIs there any library that contain many transition and css animation?
ОтветитьThank You Bro
Ответитьwow thansk for this tutorial its really helpful.... :) its the best tutorial for animation in VueJs... :)
ОтветитьSo nice and easy, thank you dude!
ОтветитьThank you. Your enunciation gave me cancer.
ОтветитьI get the 'Vue' is not defined error. Does this work on vue3?
ОтветитьThanks a lot, after a lot of searching and going through numerous videos finally I found something which actually is useful
ОтветитьThe animation is working like magic on scroll , but what if have different animations for different elements on the same component ? I really need help .
ОтветитьThanks, I wanted to learn how to scrollanimate in VueJS but ended up learning about VueJS directives and InterseptionObserver in addition to ScrollAnimate. Great video
ОтветитьThe best Vue.js animation tutorial... thanks a lot bro! :D
Ответитьvery nice, thanks
ОтветитьVery awesome stuff on this channel! Thanks for that! Your accent sounds a little bit sachsen-germany ;-) You´re welcome! I have a question: is it possible to define the 'translateX'-value with the directive like 'v-scrollanimation="100"'? I tested
bind(el, binding) {
el.classList.add('before-enter');
animatedScrollObserver.observe(el);
el.style.transform = 'translateY(' + binding.value + 'px);'
}
but it does´nt work.
Hi, thanks for the nice tutorial... its working. But I would like to have it work always when scrolling. Currently its only one time working when the page is loaded. Is there a quick solution for that?
Danke und Grüsse aus der Türkei
thanks alot for all your videos
Ответить// v-byte-intersect="{ class: 'translate-x', options: {rootMargin: '0px', threshold: 1.0}}"
const newIntersectionObserver = paramters => new IntersectionObserver(
(entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
entry.target.classList.add(paramters.class + '-enter')
observer.unobserve(entry.target)
}
})
},
paramters.options
)
export default {
bind (el, binding) {
el.classList.add(binding.value.class + '-before')
newIntersectionObserver(binding.value).observe(el)
}
}
Waste fellow you wasted my time
Ответитьdidnt work for me , whole page goes to blank
ОтветитьI got a IntersectionObserver is not defined error in scrollanimation.js, I ran npm install intersection-observer , but still getting the error, any clues?
ОтветитьIs it possible to take binding value and do something similar to vue transition to set different animation for different elements in same vue component?
ОтветитьIts working for me too!!! Plz teach me more animation.
ОтветитьVery nice.
Ответитьthis was fun and awesome, thanks a lot. i love your videos
ОтветитьThis was really easy to follow and implement thanks!!
Ответить🤩🙌🏻🏆 BEST explained! ♥️
Ответитьthanks it is working fine. how to remove 'enter' class if it is not in viewport?
ОтветитьThanks 🌸
ОтветитьGreat video and awesome explained! Thanks!
ОтветитьThankyou, i hope you can make more video about animation and transition with vue
ОтветитьVery nice tutorial. how would you integrate it with Nuxt.js?
ОтветитьAmazing.. Thanks again
ОтветитьReally enjoying the content, always learning something new, also the production quality of the videos is great too.
Now don't take this the wrong way, but I feel what's lacking is the audio quality in general and also the quite thick accent might turn viewers away and have them miss out on some really good vue-explanations.
Might want to work on that, if more exposure is something you are interested in.
I'm gonna keep watching regardless, keep the good stuff coming!
Grüße aus Dresden!