ionic4,I want to use ion-cotent to replace ion-scroll,But didn’t perform rolling
Code :
<ion-content id=“fixed” scrollX=“true” scrollEvents=“true” scrollY=“false” style=“height:44px;width: 1000px;” >
<div style=“float: left;”>英雄联盟0</div>
<div style=“float: left;”>极品飞车0</div>
<div style=“float: left;”>英雄联盟1</div>
<div style=“float: left;”>极品飞车1</div>
<div style=“float: left;”>英雄联盟2</div>
<div style=“float: left;”>极品飞车2</div>
<div style=“float: left;”>英雄联盟3</div>
<div style=“float: left;”>极品飞车3</div>
</ion-content>
You could use div
instead of the deprecated ion-scroll
, like my example there: https://github.com/ionic-team/ionic/issues/14933#issuecomment-414218453
Then how to use js code div rolling control,I am writing, but can’t scroll
html : <div class=“fixed” id=“myScroll” style=“padding-right: 10px; overflow:scroll;” scrollX=“true”>
<a style=“margin-left: 13px;”>item1</a>
<a style=“margin-left: 13px;”>item2</a>
<a style=“margin-left: 13px;”>item3</a>
<a style=“margin-left: 13px;”>item4</a>
<a style=“margin-left: 13px;”>item5</a>
<a style=“margin-left: 13px;”>item6</a>
<a style=“margin-left: 13px;”>item7</a>
<a style=“margin-left: 13px;”>item8</a>
</div>
scss:.fixed {
position: relative;
display: block;
white-space: nowrap;
overflow-x: auto;
overflow-y: hidden;
margin-top:15px;
background: white;
height: 44px;
line-height: 44px;
}
ts:var scroll = document.getElementById(‘myScroll’);
scroll.scrollTo(100, 0);