触屏手机拖动代码,请教如何实现多对象随意调用!
1.以下代码,我通过安卓手机测试,可以拖动!但只能是ID为“moveid”的单对象使用,请教如何改写成把ID赋给参数可调用性的函数!2.里面的超级链接没有用!请教是怎么回事呢,可以解决吗?
期待帮助...
<!DOCTYPE>
<html>
<head>
<meta id="viewport" name="viewport" content="width=device-width" />
<style type="text/css">
html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {margin:0;padding:0;}
.dragme{background:#DDD; color:#fff; position:absolute; left:40px; top:40px; text-align:center; display: -webkit-box;-webkit-box-orient: horizontal;-webkit-box-pack: center;
-webkit-box-align: center;}
</style>
<script type="text/javascript" src="http://code.
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<div id="kp" style="position:relative; height:200px; width:200px; overflow:hidden; background:#eee;">
<div id="moveid" class="dragme moveid">
163cssabcdefghigkmfdjksfiowejofwklfdskjlfdskjlsdfkjldsfjk
<a href="###">魂牵梦萦ljfda里别墅魂</a><br />牵梦萦里大规模地东奔西<br />走 厅大规模大规模<br />大规模 需要大规模无<br />可奈何需要需要无可奈<br />何无可奈何无可奈何<br />标有需要压根人会会 需<br />要大规模顶替无可奈何<br />使用者城顶替城大<br />规模顶替夺无可奈何大规<br />模顶替无可奈何无<br />可奈何大规模
</div>
</div>
<script type="text/javascript">
var isdrag=false;
var tx,x,ty,y;
var width =60,height =60,rotation = 0;
$(function(){
document.getElementById("moveid").addEventListener('touchstart',touchStart);
document.getElementById("moveid").addEventListener('touchmove',touchMove);
document.getElementById("moveid").addEventListener('touchend',function(){isdrag = false;});
document.getElementById("moveid").addEventListener('gesturechange',gesturechange);
document.getElementById("moveid").addEventListener('gestureend',gestureend);
});
function touchStart(e){
isdrag = true;
e.preventDefault();
tx = parseInt($("#moveid").css('left'));
ty = parseInt($("#moveid").css('top'));
x = e.touches[0].pageX;
y = e.touches[0].pageY;
}
function gesturechange(e){
e.preventDefault();
var style = e.target.style;
style.width = (width * e.scale) + "px";
style.height = (height * e.scale) + "px";
style.webkitTransform = "rotate(" + ((rotation + e.rotation) % 360) + "deg)";
}
function gestureend(e){
width *= e.scale;
height *= e.scale;
rotation = (rotation + e.rotation) % 360;
};
function touchMove(e){
if (isdrag){
e.preventDefault();
var obj1=$("#moveid")
var n = tx + e.touches[0].pageX - x;
var h = ty + e.touches[0].pageY - y;
$("#moveid").css("left",n);
$("#moveid").css("top",h);
}
}
</script>
</body>
</html>
[ 本帖最后由 dkp88 于 2013-3-24 00:25 编辑 ]