原生js写的移动端日期选择， 怎么让他是适配到页面端。 。。 下面的代码不是我写的。 我是从网上找过来的。
日期控件 地址链接：https://github.com/xfhxbb/lCa...
我是这上面下载过来了。。
//触摸开始
function gearTouchStart(e) {
e.preventDefault();
var target = e.target;
while (true) {
if (!target.classList.contains("gear")) {
target = target.parentElement;
} else {
break
}
}
clearInterval(target["int_" + target.id]);
target["old_" + target.id] = e.targetTouches[0].screenY;
target["o_t_" + target.id] = (new Date()).getTime();
var top = target.getAttribute('top');
if (top) {
target["o_d_" + target.id] = parseFloat(top.replace(/em/g, ""));
} else {
target["o_d_" + target.id] = 0;
}
}
//手指移动
function gearTouchMove(e) {
e.preventDefault();
var target = e.target;
while (true) {
if (!target.classList.contains("gear")) {
target = target.parentElement;
} else {
break
}
}
target["new_" + target.id] = e.targetTouches[0].screenY;
target["n_t_" + target.id] = (new Date()).getTime();
//var f = (target["new_" + target.id] - target["old_" + target.id]) * 18 / target.clientHeight;
var f = (target["new_" + target.id] - target["old_" + target.id]) * 18 / 370;
target["pos_" + target.id] = target["o_d_" + target.id] + f;
target.style["-webkit-transform"] = 'translate3d(0,' + target["pos_" + target.id] + 'em,0)';
target.setAttribute('top', target["pos_" + target.id] + 'em');
}
//离开屏幕
function gearTouchEnd(e) {
e.preventDefault();
var target = e.target;
while (true) {
if (!target.classList.contains("gear")) {
target = target.parentElement;
} else {
break;
}
}
var flag = (target["new_" + target.id] - target["old_" + target.id]) / (target["n_t_" + target.id] - target["o_t_" + target.id]);
if (Math.abs(flag) <= 0.2) {
target["spd_" + target.id] = (flag < 0 ? -0.08 : 0.08);
} else {
if (Math.abs(flag) <= 0.5) {
target["spd_" + target.id] = (flag < 0 ? -0.16 : 0.16);
} else {
target["spd_" + target.id] = flag / 2;
}
}
if (!target["pos_" + target.id]) {
target["pos_" + target.id] = 0;
}
rollGear(target);
}
在页面端怎么都没用。。。
在移动端是可以滚动的。
需要让他适配到页面端。。
谢邀.
pc端没用是因为它所有绑定的事件都是touchstart、touchmove和touchend。你可以这样改下试试：首先在私有变量里加仨变量，然后在init里加段识别pc端还是移动端的代码，识别完了确定仨变量是移动端事件还是pc端事件，最后所有的事件绑定都改成这仨变量就好了。
你截取的是实现动画效果的那块，看了绑定动画的事件，全都绑定在 touch 事件上，
应该本来就不支持鼠标事件，试了下直接把这些动画绑定到鼠标事件是不匹配的。
首先你应该判断是否 PC 端，
其中一个方法如下：
然后你可以对应绑定事件，对应关系如下：
对此参考：https://mobiforge.com/design-...
最后页面端的拖拽动画得你自己弄了。。
另外一个解决方案是先判断 pc / 移动端，
在 pc 端上直接调用别的套件得了，
不用想这个本来针对移动端开发的套件如何适配页面端的问题。
谢邀。
个人建议PC端和移动端分开写，对于结构比较复杂的管理型系统，写响应式网页比分别针对 PC 和移动写两个版本成本和技术风险都要高得多。而且就是从用户体验的角度来说，PC 和移动本来就有不同的体验，分开写也更合适。纯展示性的页面写响应式问题不大，用响应式CSS框架就可以解决。