Question

我使用角度ngx-gallery构建了一个图库。由于小图像和大图像没有显示，我无法获得对工作的响应。它只显示媒体大小的图像。

以下是我实施它的方式：

以下是选项：

this.galleryOptions = [
        {
            width: '100%',
            height: '254px',
            imageAutoPlay: true,
            imageAutoPlayPauseOnHover: true,
            imageSize: NgxGalleryImageSize.Contain,
            imageAnimation: NgxGalleryAnimation.Slide,
            thumbnails: false,
            preview: false
        },
        // max-width 544
        {
            breakpoint: 544,
            width: '100%',
            height: '250px',
            imageSwipe: true,
            imageArrowsAutoHide:true,
            imageAutoPlay: true,
            imageAutoPlayPauseOnHover: true,
            imageSize: NgxGalleryImageSize.Cover,
            imageAnimation: NgxGalleryAnimation.Slide,
            thumbnails: false,
            preview: false
        }
    ];

这是图像数组:(所有网址都已检查）

    this.galleryImages = [
        {
            small: 'assets/images/BannersResponsive/culturizate.jpg',
            medium: 'assets/images/Banners/radio_online_venezuela_fondo_demananacontigo.png',
            big: 'assets/images/BannersResponsive/culturizate.jpg'
        },
        {
            small: 'assets/images/BannersResponsive/culturizate.jpg',
            medium: 'assets/images/Banners/radio_online_venezuela_fondo_conexionyreflexion.png',
            big: 'assets/images/Banners/radio_online_venezuela_fondo_conexionyreflexion.png'
        }, ];

这是html：

<ngx-gallery class="gallery"                        
  [options]="galleryOptions                         
  [images]="galleryImages"></ngx-gallery>

我也尝试将图像命名为相同的名称，并在名称的末尾加上小，中，大。

提前谢谢。

Answer 1

我在CSS中遇到过

.mat-sidenav-container, .mat-sidenav-content, .mat-tab-body-content { transform: none !important; }

删除它后，所有尺寸的东西都可以正常工作。

ngx-gallery仅显示中等大小的图像

1 个答案: