我正在尝试向下滚动以下网站,在移动视图中我不能,有任何建议吗?非常感谢
事情就是我明白,由于我正在使用的菜单,这可能会发生,但我无法在HTML中将其作为正常的
滚动。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.1/normalize.min.css">
<link rel="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<link href='http://fonts.googleapis.com/css?family=Raleway:100,200,300,400' rel='stylesheet' type='text/css'>
<!-- build:js modernizr.touch.js -->
<script src="elastic/modernizr.touch.js"></script>
<!-- endbuild -->
<link href="elastic/index.css" rel="stylesheet">
<!-- build:css mfb.css -->
<link href="elastic/mfb.css" rel="stylesheet">
<!-- endbuild -->
<link rel="stylesheet" href="elastic/style.css">
<style>
.ion-location{
color : #FB0000;
}
.ion-social-facebook{
color : #3b5998;
}
.ion-social-googleplus{
color : #d34836;
}
.ion-social-instagram-outline{
color : #3f729b;
}
</style>
</head>
<body>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<link href="elastic/ionic.css" rel="stylesheet">
<script src="elastic/ionic.bundle.js"></script>
<ion-header-bar class="bar-positive bar bar-header disable-user-behavior" >
<h1 class="title">Sobre mí</h1>
</ion-header-bar>
<ion-content delegate-handle="example-scroller" elastic-header="example-elastic-header" overflow-scroll="false" class="scroll-content ionic-scroll has-header"><div class="scroll" style="transform: translate3d(0px, -1px, 0px) scale(1);" >
<div id="example-elastic-header" class="background-image" style="transform-origin: center bottom 0px; transform: translate3d(0px, 0.5px, 0px) scale(1, 1); background-image: url("los7aguacates.jpg");"></div>
<div class="content">
<div class="padding">
<h1>Los 7 aguacates </h1>
<p>Mi vida ha estado siempre marcada por mis grandes amores y pasiones:<br><br>
- La nutrición, y la posibilidad de “curar lo incurable” a través de una alimentación adecuada.<br><br>
- La gente, y la posibilidad de mejorar su vida, aumentar la autoestima, transformar la mente y acompañar a las personas durante el proceso de cambio mientras observo los maravillosos pasos hacia la salud y el bienestar.<br><br>
- Mi país, Polonia y España, que por elección es mi segunda casa.<br><br>
- Los aguacates, que no sé muy bien por qué, pero se han hecho una parte inseparable de mí ;)
"</p>
<p>Justo por eso estoy donde estoy, hago lo que hago y …!quiero seguir! </p><p>
Todos tenemos el poder de impactar en la vida de otra persona. ¿Por qué no aprovecharlo para mejorar la salud y la calidad de vida de los demás? Quiero que la buena alimentación se haga viral (¡ya ves que necesito tu ayuda para ello!) e impacte en todas las personas, mostrando también a los peques (¡que son las nuevas generaciones!) qué significa comer bien y cómo. A través de una vida saludable, se pueden evitar muchos problemas de salud.
</p><p>Únete a mi movimiento, al movimiento de los7aguacates, un movimiento que promueve la alimentación sana como forma de vida, como base para una existencia más plena y feliz. ¡Un movimiento que quiere “curar lo incurable”! Comiendo bien, compartiendo recetas, dando ejemplo tú también impactas positivamente en los demás, ¿quieres ser mi ayudante? Te necesito, necesito tu impacto para llegar a otras personas. ¡Formemos un equipo! Comer bien es fácil y divertido. ¡Yo te lo mostraré!</p>
</div>
<div class="list">
</div>
</div>
</div><div class="scroll-bar scroll-bar-v"><div class="scroll-bar-indicator scroll-bar-fade-out" style="transform: translate3d(0px, 1px, 0px) scaleY(1); height: 356px;"></div></div></ion-content>
<ul id="menu" class="mfb-component--tr mfb-fountain " data-mfb-toggle="hover">
<li class="mfb-component__wrap">
<a href="#" class="mfb-component__button--main">
<i class="mfb-component__main-icon--resting ion-navicon-round"></i>
<i class="mfb-component__main-icon--active ion-close-round"></i>
</a>
<ul class="mfb-component__list">
<li>
<a href="external://https://www.facebook.com/los7aguacates/" data-mfb-label="Sígueme en Facebook" class="mfb-component__button--child">
<i class="mfb-component__child-icon ion-social-facebook"></i>
</a>
</li>
<li>
<a href="external://https://www.instagram.com/los7aguacates/" data-mfb-label="Sígueme en Instagram" class="mfb-component__button--child">
<i class="mfb-component__child-icon ion-social-instagram-outline"></i>
</a>
</li>
<li>
<a href="external://https://play.google.com/store/apps/details?id=com.mubiquo." data-mfb-label="Valora la app" class="mfb-component__button--child">
<i class="mfb-component__child-icon ion-heart"></i>
</a>
</li>
</ul>
</li>
</ul>
<section id="panel" class="panel">
</section>
<!-- build:js mfb.js -->
<script src="elastic/mfb.js"></script>
<!-- endbuild -->
<script>
var panel = document.getElementById('panel'),
menu = document.getElementById('menu'),
showcode = document.getElementById('showcode'),
selectFx = document.getElementById('selections-fx'),
selectPos = document.getElementById('selections-pos'),
// demo defaults
effect = 'mfb-zoomin',
pos = 'mfb-component--br';
showcode.addEventListener('click', _toggleCode);
selectFx.addEventListener('change', switchEffect);
selectPos.addEventListener('change', switchPos);
function _toggleCode() {
panel.classList.toggle('viewCode');
}
function switchEffect(e){
effect = this.options[this.selectedIndex].value;
renderMenu();
}
function switchPos(e){
pos = this.options[this.selectedIndex].value;
renderMenu();
}
function renderMenu() {
menu.style.display = 'none';
// ?:-)
setTimeout(function() {
menu.style.display = 'block';
menu.className = pos + effect;
},1);
}
</script>
<script src="elastic/index.js"></script>
</body>
</html>