Seeking Angular 6 animation code similar to this (hover scrolling).
I have linked the jsfiddle below. Attempted in Angular 6 but encountering errors like "Cannot read property 'animate' of null," and "Cannot read property 'hover' of null."
http://jsfiddle.net/gaby/xmAvh/
this.nativeElement.querySelector('#hover1').hover(() => {
this.amount = '+=10';
this.scroll();
}, () => {
this.amount = '';
});
this.nativeElement.querySelector('#container').animate({scrollTop: this.amount}, 100, 'linear', () => {
if (this.amount !== '') {
this.scroll();
}
});
<div id="hover"> HOVER ME </div>
<div id="container">resemblance reflected in some of the bird's names. It was 30 cm (12 in) long and larger and more robust than any other blue pigeon species. It could raise its hackles into a ruff, which it used for display. Its call sounded like "barf barf" and it also made a cooing noise. It fed on fruits, nuts, and molluscs, and was once widespread in the forests of Mauritius. The bird was first mentioned in
</div>
<div id="hover2"> HOVER ME </div>
Your assistance is greatly appreciated!