Un usuario preguntó 👇
Hola a todos,
Me encanta el tema Twenty Twenty, pero la función de desplazamiento de imagen / portada de plantilla de imagen no funciona en dispositivos iOS (iPhone 6S y iPad Pro 10,5 ”y ambos funcionan con iOS 13.3). La imagen se amplía al máximo. Veintisiete años parece tener el mismo error.
Esto soluciona el problema, pero corrige la imagen de esta manera.
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
.cover-header.bg-attachment-fixed {
background-attachment: scroll;
}
}Encontré este comportamiento accidentalmente usando el iPad de un amigo. Debido a que este es un problema global, les pediría a los desarrolladores que solucionen esto, de acuerdo con el código anterior y una nota en el tema o la documentación de corrección real. Otros desarrolladores parecen haber logrado arreglar el desplazamiento de imágenes de paralaje en dispositivos iOS. Pero esto no debe pasar desapercibido para los usuarios.
muchas gracias
(@ tungstene2)
hace 1 año
https://wordpress.org/support/topic/twenty-twenty-featured-image-issues/#post-12317148
(@ tungstene2)
hace 1 año
https://wordpress.org/support/topic/twenty-seventeen-ipados-front-page-featured-images/
(@ tungstene2)
hace 1 año
Boleto comprobado:
https://github.com/Automattic/themes/issues/1747
(@jarretc)
hace 1 año
Hola, aquí hay un boleto de pista para la versión oficial del tema:
https://core.trac.wordpress.org/ticket/48802
Veo que creó una edición en Github con Automattic pero no manejarían una versión .org del tema.
(@raqai)
hace 1 año
Este es un problema general en la mayoría de los dispositivos iOS y ya se conoce desde hace años. La portada de fondo se comporta de manera diferente en iOS. Utiliza la altura del cuerpo en lugar de la altura del contenedor, lo que puede resultar en una altura corporal muy alta en dispositivos móviles o tabletas, lo que alarga enormemente el fondo.
Este es un problema de la combinación de background-size: cover; y background-attachment: fixed;.
Consulte esta publicación de flujo:
https://stackoverflow.com/questions/24154666/background-size-cover-not-working-on-ios
Puede usar un div dentro de un div y dejar que el segundo div contenga una imagen y un position:fixed pero como resultado, este div no sería consciente del contenido y, por lo tanto, solo puede usar una portada en la página que haría la imagen de fondo del encabezado para que la escriba. Javascript solo sería una solución que ayuda aquí.
En pocas palabras: si desea utilizar múltiples cubiertas de paralaje en iOS sin agregar un código irrazonable -> no puede.
Dado que la recomendación general desaconseja el uso de los efectos del paralaje en dispositivos móviles, ya que requiere muchos cálculos y haría preguntas sobre CPU móviles «más pequeñas», le sugiero que reconsidere sus opciones de diseño si se mantienen. Utiliza un efecto de paralaje en pantallas.
Utilizo el siguiente código (considerando el primer desarrollo móvil) en mis páginas. Esta es básicamente una solución similar a la que ya tiene en lugar de pensar en el primer desarrollo móvil. Normalmente, debería solucionar este problema excluyendo los efectos de paralaje en pantallas más pequeñas.
.bg-attachment-fixed, .wp-block-cover-image.has-parallax, .wp-block-cover.has-parallax {
background-attachment: scroll;
}
@media (min-width: 1000px) {
.bg-attachment-fixed, .wp-block-cover-image.has-parallax, .wp-block-cover.has-parallax {
background-attachment: fixed;
}
}
Esta respuesta fue modificada hace 1 año por. Esta respuesta fue modificada hace 1 año por.
(@ tungstene2)
hace 1 año
gracias por la respuesta.
Mi punto es que si se trata de un error conocido desde hace mucho tiempo, esto debe ser manejado directamente en el tema y no por todos los usuarios que lo encuentren. Todos los demás asumirían que un tema en 2020 debería funcionar perfectamente con todos los navegadores populares, incluido iOS. ¿O me equivoco?
(@raqai)
hace 1 año
Este no es un error relacionado con el tema, sino un error dentro de la implementación. background-size: cover; y background-attachment: fixed; dentro del navegador, lo que significa que probablemente deba confiar en Apple / Google para solucionar este problema, no en el creador del tema.
Pero sí, tal vez el CSS anterior debería implementarse dentro del tema para comentar por qué esto no es paralaje en un teléfono móvil (como mencionaste anteriormente).
Esta respuesta fue modificada hace 1 año por.
(@ tungstene2)
hace 1 año
Porque no tenemos ninguna posibilidad de que Apple solucione esto, pero el tema, el tema debería manejar esto. ¿Cuál es la mejor manera de adherirse a esto?
(@ tungstene2)
hace 1 año
@raqai tu configuración solo funciona para tu iPhone pero no para tu iPad. Volveré a la configuración que publiqué anteriormente.
(@raqai)
hace 1 año
@raqai tu configuración solo funciona para tu iPhone pero no para tu iPad. Volveré a la configuración que publiqué anteriormente.
Probablemente me perdí el problema de los medios para tu iPad. No tengo uno aquí para probarlo correctamente. Gracias por la info 🙂
Porque no tenemos ninguna posibilidad de que Apple solucione esto, pero el tema, el tema debería manejar esto. ¿Cuál es la mejor manera de adherirse a esto?
Dependiendo de lo que quiera decir con «el tema debe manejar».
Si tiene la intención de no usar un fondo fijo e ignorar el paralaje en dispositivos móviles: Definitivamente sí. Esto se puede lograr con el CSS anterior y debe agregarse al tema de forma predeterminada.
Si tiene la intención de implementar el paralaje en dispositivos móviles: No, el tema no debería manejar esto en absoluto. Ésta es una cuestión técnica. Todas las «soluciones» actualmente disponibles resultarían en una cantidad significativa de gastos generales y afectarían negativamente el rendimiento de su sitio web.
Esta respuesta fue modificada hace 1 año por.
(@ tungstene2)
hace 1 año
sí, me refiero a la opción 1 que mencionaste. Establezca un fondo e ignore el paralaje si no es compatible con ciertos motores de navegador.
(@ tungstene2)
hace 1 año
Tampoco tengo un iPhone ni un iPad. Tuve que pedirle a un amigo que lo probara por mí…. 🙁
(@ tungstene2)
hace 1 año
@raqai ¿Cómo abordar esto para agregar el tema por defecto? ¿Están leyendo aquí los desarrolladores de temas? ¿Dónde crear un ticket para esto?
fixed background and ignore parallax on iOS devices (iPhone, iPad)
Esta respuesta fue modificada hace 1 año por.
(@ tungstene2)
hace 1 año
¿nadie?
(@ tungstene2)
hace 1 año
huhu, ¿alguien está leyendo aquí?
¿Solucionó tu problema??
0 / 0