Почему якорный тег не работает на мобильном телефоне? ⇐ Jquery

[Anonymous]

Моя проблема заключается в том, чтобы заставить теги привязки работать на мобильных устройствах. Разумеется, с шириной

Я использую Bootstrap 4, Codepen здесь: https://codepen.io/diegomengue/pen/vwwjpj.
html:

• Diego Mengue
• Portfólio
• Contato

< /code>
css: < /p>
body {
background-color: #EAEDFB;
color: white;
font-size: 20px;

.navbar{
background-color: #6F7ECC;
top: 0.5em;
width: 74%;
}

li {
padding: 0.3em 0.3em 0.3em 0.3em;
margin: 0 0.3em 0 0.3em;
}

a {
color: white;
pointer-events: auto;
}

a:link {
color: white;
text-decoration: none;
}

a:visited {
color: white;
text-decoration: none;
}

a:hover {
color: #D9DDF3;
text-decoration: none;
}
a:active {
color: white;
text-decoration: none;
}

form {
margin-bottom: 0.5em;
}

h1 {
font-size: 3em;
}

h2 {
font-size: 2.5em;
}
h4 {
font-size: 1.5em;
}

h5 {
font-size: 1.5em;
margin-bottom: 0.5em;
}

p {
font-size: 1em;
}

.vertical-align {
display: flex;
align-items: center;
}

#icone {
width: 2.5em;
margin: 0 0.6em 0 0.6em;
}

hr {
background-color: white;
}

h1, h2 {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
#divPortfolio {
height: 800px;
}

.text-right {
margin-right: 0.3em;
}

footer {
background-color:#6F7ECC;
width: 74%;
text-align: center;
}

::-webkit-input-placeholder {
font-size: 1em!important;
}

:-moz-placeholder { /* Firefox 18- */
font-size: 1em!important;
}
::-moz-placeholder { /* Firefox 19+ */
font-size: 1em!important;
}

@media screen and (min-width: 0px) {
body {font-size: 10px;}
.navbar {font-size:1.2em;}
footer {font-size: 0.6em; height: 5em; padding-top: 1.4em;}
h4 {margin-top: 1em;}
}

@media screen and (min-width: 768px) {
body {font-size: 13px;}
.navbar {font-size: 1.2em;}
footer {font-size: 1em; height: 3em;
padding-top: 1.4em;}
h4 {margin-top: 0em;}
}

@media screen and (min-width: 992px) {
body {font-size: 14px;}
}

@media screen and (min-width: 1200px) {
body {font-size: 16px;}
}
< /code>
js: < /p>
var mq = window.matchMedia( "(min-width: 768px)" );

function scrollToAnchor(aid){
var aTag = $(aid);
if (mq.matches) {
$('body').animate({scrollTop: (aTag.offset().top)-82},'slow');
} else {
$('body').animate({scrollTop:(aTag.offset().top)-180},'slow');
}
};

$("#inicioMenu").on('click touchend', function(e) {
e.preventDefault();
scrollToAnchor("#inicio");
return false;
});

$("#portfolioMenu").on('click touchend', function(e) {
e.preventDefault();
scrollToAnchor('#portfolio');
return false;
});

$("#contatoMenu").on('click touchend', function(e) {
e.preventDefault();
scrollToAnchor('#contato');
return false;
});


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