Search code examples
jqueryflashphoto

Photo Collage with JQuery


I would like to develop a Photo Collage that similar to http://www.fotor.com/features/collage.html with JQuery

Edited: I have searched several days. Fotor Collage uses Flash. I also tried with some form builders as http://www.botsko.net/blog/2009/04/07/jquery-form-builder-plugin/. I modified these according to my needs and export the form to XML file for later use in another. The app currently support only typical html elements as text. I still need to add photos and movies.

Thank you very much for your help.


Solution

  • First, you are trying to do 2 different things:

    1. on CLIENT: drag and drop effect with pics and documents
    2. on SERVER: upload that file (maybe with AJAX. check out this plugin)

    For the CLIENT part you could use jQuery UI droppable.

    Once the file is dropped (using droppable events), you can upload that file. code example:

    $( ".selector" ).droppable({
      drop: function( event, ui ) { alert("here i can upload my file"); }
    });
    

    Here it is an example for beginning coding: http://jqueryui.com/droppable/#photo-manager.