[aslan2030]

Собственно как загрузить картинку "drag'n drop"-ом на специальное поле на сайте, без использовании сервера, и выводить его на другом поле?

(задание такое что надо загрузить фотку человека и придавать ему "смешное лицо", Например: надеть шляпу, очки, бороду и т.д. , НО надо php использовать нельзя)

html:

<div class="picture"></div>

css:
.picture{
background: url("Ссылка");
}


делаю так:
jquery:

drop[0].ondrop = function(event) {
        event.preventDefault();
        drop.removeClass('hover');
        drop.addClass('ondrop');
        
        var file = event.dataTransfer.files[0];
        
        
        if (file.size > maxSize) {
            drop.text('Файл слишком большой!');
            drop.addClass('error');
            return false;
        }else if(file.type != "image/jpeg"){
            alert("only jpeg or jpg !!!");
            drop.removeClass("ondrop");
        }else{
            drop.text("Файл добавлен!").removeClass("ondrop").addClass("dropped").delay(700).queue(function(){
                drop.removeClass("dropped").html("Drop your face file here <br/><span style='color:red;'>Only JPG file. Maximum 300 Kb.</span>");
            });
            $("#imageFace").css({
                "background":"НЕМОГУ ВЗЯТЬ АБСОЛЮТНЫЙ ПУТЬ",
            });
  }
    };