Question

I have a menu

             <div id="nav">
     <ul>
        <li><a href="http://www.example.com"> Home </a></li>
        <li><a href="http://www.example.com"> About </a></li>
        <li><a href="http://www.example.com"> Contact </a></li>
      </ul>
                    </div>

and a drop zone

     <div id="dropzone">
     </div>

Once one of the list items is dropped in the dropzone it will then redirect to the link.I am using jQuery UI but I can’t figure out how to do this can somebody help me out?

Answer 1

$(function(){
    $("#dropzone").droppable(
        {
          drop: function(event, ui){
          window.location.href = ui.draggable.find("a").attr("href");
        }
    });

    $("li").draggable();
});

See http://jsfiddle.net/PHU8C/