Flickity Fullscreen option on Shopify store

Hi guys,

having this code in the Shopify custom liquid section for Flickity slider does not allow fullscreen display of individual images in the slider. Is there anything I'm doing wrong? I know I have to attach fullscreen libraries separately, but I did that and it still doesn't work.

{{ "flickity.css" | asset_url | stylesheet_tag }}
{{ "fullscreen.css" | asset_url | stylesheet_tag }}
{{ "mc-custom-slider.css" | asset_url | stylesheet_tag }}
{{ "animate.min.css" | asset_url | stylesheet_tag }}

<div class="carousel" data-flickity='{ "fullscreen": true, "wrapAround": true, "freeScroll": true, "pageDots": false, "draggable": true }'>
    {%- for block in section.blocks -%}
    <div>
        <img src="{{ block.settings.desktopImage | img_url: 'master'}}" alt="{{ block.settings.desktopImage.alt }}"/>
    </div>
    {%- endfor -%}
</div>

{{ 'jquery-3.6.1.js' | asset_url | script_tag }}
{{ 'flickity.pkgd.js' | asset_url | script_tag }}
{{ 'fullscreen.js' | asset_url | script_tag }}



{% schema %}
{
    "name": "Flickity Slideshow",
    "settings": [
      
    ],
    "blocks" : [
      {
        "type" : "column",
        "name" : "slide",
        "settings" : [
          {
            "type": "image_picker",
            "id" : "desktopImage",
            "label" :  "Desktop Image"
          }
        ]
      }
    ],
    "presets": [
      {
        "name": "Flickity Slider"
      }
    ]
  }
{% endschema %}

Thank you!

No repository file or test is named. Start by reproducing the supplied Shopify custom Liquid snippet with Flickity and the separately loaded fullscreen assets, then verify whether the fullscreen option works for the generated carousel. Done means identifying a reproducible cause and documenting a concrete resolution or confirming the issue is external to Flickity.