我正在写下面的一个控件，用html5 input range控件实现的时候安卓没有问题，可是ios会出问题，不能点击，而且滑块还会回退各种不兼容。贴吧里有哪位大神有类似的控件？

我最近也在写range
设置字体大小：
<span id="sizevalue">0</span>px<input id="sizeline" type="range" onchange="readydraw('str')" oninput="readydraw('str')" max="200" min="0" value="30" step="1"/>
<div class="form-group">
<label for="m_str1">请输入第一句话：</label>
<input name="str1" type="text" class="form-control" id="m_str1value=""/> </div>
<div class="form-group">
<label for="m_str2">请输入第二句话：</label>
<input name="str2" type="text" class="form-control" id="m_str2" value=""> </div>
<div class="form-group">
<label for="m_str3">请输入第三句话：</label>
<input name="str3" type="text" class="form-control" id="m_str3" value="" > </div>
想要的结果就是。。这一个滚动条 能够分别控制这3个文本框输出的文字大小
出现在同一个页面上。
写了十几个小时了也没有成功。。。JS实在太差了。。。
这种问题也不知道该怎么去搜索相关内容
无奈求助 希望老哥看到能帮忙指点一二 感谢