ngx-image-gallery
ngx-image-gallery copied to clipboard
When reactToMouseWheel set to false, page should scroll but it does not
This bug seems to be present regardless of the 'reactToMouseWheel' setting.
Any workaround on this?
Same issue, when i try scroll on gallery page not react, any solutions?
Same
+1
Workaround:
- Create a container around the gallery:
<div #galleryContainer>
<ngx-image-gallery ... ></ngx-image-gallery>
</div>
- Create a ViewChild in the controller:
@ViewChild('galleryContainer')
public galleryContainer: ElementRef;
- Make the controller implement
AfterViewInit
:
public ngAfterViewInit(): void {
this.hackGalleryScrollEvent();
}
- Stop the scroll event propagation, capture it and bubble up:
// TODO: Remove once this bug is fixed (https://github.com/thatisuday/ngx-image-gallery/issues/14)
private hackGalleryScrollEvent() {
const el = (<HTMLDivElement>this.galleryContainer.nativeElement);
el.addEventListener('mousewheel', (event) => {
event.stopPropagation();
}, {
capture: true
});
}
The page should now scroll when you scroll on the gallery.