我需要帮助解决一个我似乎无法掌握的小问题:
当我触摸一个字符(很多字符 -> 很多跨度)时,屏幕底部会显示跨度。在跨度中是有关角色的一些信息 - 因为我想让它适合移动设备,所以我希望用户滚动浏览这些信息。
到目前为止,我发现了一些对我有帮助的代码:
<body onload="touchScroll('test')">
<script>
function isTouchDevice(){
try{
document.createEvent("TouchEvent");
return true;
}catch(e){
return false;
}
}
function touchScroll(id){
if(isTouchDevice()){ //if touch events exist...
var el=document.getElementById(id);
var scrollStartPos=0;
document.getElementById(id).addEventListener("touchstart", function(event) {
scrollStartPos=this.scrollTop+event.touches[0].pageY;
event.preventDefault();
},false);
document.getElementById(id).addEventListener("touchmove", function(event) {
this.scrollTop=scrollStartPos-event.touches[0].pageY;
event.preventDefault();
},false);
}
}
并且 ID 为“test”的跨度变为可滚动的。伟大的。但是由于我有数百个跨度,我无法为每个跨度分配一个 id。所以我想知道你是否可以帮助想出一种让每个类“tt”都可以滚动的方法。
我尝试在触摸时将“test”-id 重新分配给下一个元素。但这没有用。我尝试将“test”-id 添加到每个类“tt” - 也没有工作。
如果您想让自己了解情况:这是我的测试站点!