Как решить проблему сотрясения параллакса? на Shopify ⇐ Html

[Anonymous]

Я только что создал новый раздел под названием Parallax Banner. После настройки я проверил это - все работает гладко на хроме, никаких проблем вообще. Но когда я пробую это на сафари, эффект становится шатким. Я даже использовал ИИ, чтобы найти причину проблемы, но все еще нет решения. Я также проверил его на нескольких устройствах, используя Safari, и проблема остается прежней.
https://go.screenpal.com/watch/ctex1hn1gpp
{% style %}
.simple-parallax-{{ section.id }} {
position: relative;
height: {{ section.settings.desktop_height }}px;
width: 100%;
overflow: hidden;
background-color: {{ section.settings.background_color }};
}

.parallax-bg-{{ section.id }} {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('{{ section.settings.background_image | img_url: '5000x' }}');
background-position: center;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
}

@media screen and (max-width: 768px) {
.simple-parallax-{{ section.id }} {
height: {{ section.settings.mobile_height }}px;
}

/* On mobile, disable fixed background as it causes issues */
.parallax-bg-{{ section.id }} {
background-attachment: fixed;
}
}
{% endstyle %}




{% schema %}
{
"name": "Simple Parallax",
"settings": [
{
"type": "header",
"content": "Background Settings"
},
{
"type": "image_picker",
"id": "background_image",
"label": "Background Image"
},
{
"type": "color",
"id": "background_color",
"label": "Background Color (if no image)",
"default": "#000000"
},
{
"type": "header",
"content": "Section Size"
},
{
"type": "range",
"id": "desktop_height",
"min": 200,
"max": 1000,
"step": 50,
"default": 500,
"label": "Section Height (Desktop)",
"unit": "px"
},
{
"type": "range",
"id": "mobile_height",
"min": 150,
"max": 600,
"step": 50,
"default": 350,
"label": "Section Height (Mobile)",
"unit": "px"
}
],
"presets": [
{
"name": "Simple Parallax",
"category": "Background"
}
]
}
{% endschema %}



Подробнее здесь: https://stackoverflow.com/questions/794 ... on-shopify