Идентификаторы привязки не точны на мобильных устройствах с реагирующим маршрутизатором ha sh link - PullRequest
Новая
       95

Идентификаторы привязки не точны на мобильных устройствах с реагирующим маршрутизатором ha sh link

0 голосов
/ 09 июля 2020

Проблемы с реактивным маршрутизатором ha sh ссылка на мобильном телефоне.

На настольном компьютере он отлично работает, но на мобильном телефоне он дает мне смещение, которое иногда более 100vh от моего тега привязки.

Здесь устанавливаются ссылки 

 <AnchorLink 
  to={`audio-demos/#${anchorTitle}`} 
  className={`item ${classItem}`}  
  style={{ backgroundImage: `url(${src})` }}


  >
</AnchorLink>

Здесь устанавливается идентификатор 

return (
<>
<div className="spacer" id={id}></div>
<div className='demo-audio-container' >
  <h2 >{title}</h2>
  
  <div className='adverts-container'>
    <div className='adverts-left'>

Сайт, который я разрабатываю, https://ingrid-voice.netlify.app/

, вы можете воссоздать проблему, открыв devtools в chrome и выбрав, например, iphone 5 или 7. go на главную страницу и щелкните ссылку в разделе портфолио. Это приведет вас к странице аудио и якорной ссылке. На рабочем столе работает, но на мобильном устройстве привязка не находится в верхней части экрана.

Есть идеи? Спасибо

1 Ответ

0 голосов
/ 10 июля 2020

Мне удалось сделать обходной путь, удалив анимированное изображение героя на мобильном телефоне. Кажется, проблема решена на моем android, но проблема все еще наблюдается на iphone 7.

...