这种功能怎么实现啊，求教

本帖最后由 asdfg123_ 于 2012-11-25 13:35:25 编辑

解决方案 »

  1.   

    <html>
    <head>
    <style>
    a{
    position:relative;
    }
    </style>
    <script type="text/javascript">
    mouseover=true
    function coordinates()
    {
    if (!moveMe)
    {
    return
    }
    if (event.srcElement.id=="moveMe")
    {
    mouseover=true
    pleft=document.getElementById('moveMe').style.pixelLeft
    ptop=document.getElementById('moveMe').style.pixelTop
    xcoor=event.clientX
    ycoor=event.clientY

    document.onmousemove=moveImage
    }
    }function moveImage()
    {
    if (mouseover&&event.button==1)
    {
    document.getElementById('moveMe').style.pixelLeft=pleft+event.clientX-xcoor
    document.getElementById('moveMe').style.pixelTop=ptop+event.clientY-ycoor
    return false
    }
    }function mouseup()
    {
    mouseover=false;
    }
    document.onmousedown=coordinates
    document.onmouseup=mouseup
    </script>
    </head>
    <body>
    <a  id="moveMe" href = "http://www.baidu.com" >百度</a>
    </body>
    </html>
    是类似这样吧。。
      

  2.   

    <html>
    <head>
    <style>
    a{
    position:relative;
    }
    </style>
    <script type="text/javascript">
    mouseover=true
    function coordinates(event){
    if (!moveMe){
    alert("return");
    return;
    }
    var event = event || window.event;
    var eventId = event.srcElement?event.srcElement.id : event.target.id;
    if (eventId =="moveMe"){
    mouseover=true;
    pleft=document.getElementById('moveMe').style.pixelLeft;
    ptop=document.getElementById('moveMe').style.pixelTop;
    xcoor=event.clientX;
    ycoor=event.clientY;
    document.onmousemove=moveImage
    }
    }function moveImage(event){
    var event = event || window.event;
    //alert(mouseover+"---"+event.button);
    var eventButton = event.target?event.button:event.button-1;
    //因为鼠标事件在不同浏览器下，取值是不同的，自己可以去查查看。
    if (mouseover&&eventButton == 0){
    document.getElementById('moveMe').style.pixelLeft=pleft+event.clientX-xcoor;    document.getElementById('moveMe').style.pixelTop=ptop+event.clientY-ycoor;
    return false;
    }
    }function mouseup(){
    mouseover=false;
    }
    document.onmouseup=mouseup;
    document.onmousedown=coordinates;</script>
    </head>
    <body>
    <a  id="moveMe" href = "http://www.baidu.com" >百度</a>
    </body>
    </html>这样写一下吧，这样在火狐下还有个问题。
    还没有解决。
    document.getElementById('moveMe').style.pixelLeft
    就是这个东西，在火狐下无法取到值，也没有办法赋值。
      

  3.   

    拖动之前加在js中加this._Handle.setCapture();拖动停止时加this._Handle.releaseCapture();参考
    由于A标签是内嵌标签，即使是加display:inline-block;样式在某些游览器下还是不能被拖动的。
      

  4.   

    portal门户网站？应该是用js实现的吧，很像原先的igoogle的
      

  5.   

    这种插件jquery的很多  搜一下
      

  6.   

    拖动鼠标的时候把A标签替换成span标签，拖动完成后在替换回来。
      

  7.   

    是怎样来解决的呢？是直接在拖动鼠标的时候吧a标签替换成span标签的吗？