スマートフォン用のWebアプリケーションを作成しています．  
画面はコンテンツエリア，真ん中のエリア，タッチエリアに分かれています．  
[![キャプチャ画像](https://i.stack.imgur.com/46f9I.png)](https://i.stack.imgur.com/46f9I.png)

## やりたいこと

下のタッチエリアでタッチして一番上のコンテンツエリアをスクロールしたり，タップしたりしたいです．

現状は`touchstart`, `touchmove`, `touchend`に対し，

```

    function dispatch(e) {
        var evt = document.createEvent('Event')
        evt.initEvent(e.type, true, true)
        contentArea.dispatchEvent(evt)
    }
    
```

のように新しいイベントを作成して，タッチイベントを送ろうとしているのですが，うまくいきません．具体的には，タッチエリアで発生した`touchstart`,
`touchmove`, `touchend`はコンテンツエリアの要素に送れているようなのですが，上のコンテンツエリアがスクロールされません．

どなたかわかる方がいらっしゃいましたら，教えていただけると助かります．
CC BY-SA 3.0
2017-10-16T03:16:05.380
38743
2017-10-18T06:42:58.900
2020-06-17T08:14:45.997
-1
16964
question
javascript
JavaScriptである要素に行われたタッチイベントを別の要素に移したい．
ブラウザはプログラムから人工的に作られたイベントに対しては反応しないよう仕様で決められています。

よって、イベントを作ってdispatchする手法は諦め、自分でスクロールさせるコードを書く必要があります。
CC BY-SA 3.0
2017-10-18T06:42:58.900
38832
2017-10-18T06:42:58.900
3475
38743
answer