php - Ajax image using jquery form.js -


i working piece of code. here using jquery, jquery form.js, , jqueryui. task upload image in upload folder , store path of image along position set users (jqueryui draggable used this). works fine. don't know how works.

can explain me how grabbing dragged position set users , how whole thing working together. if need see php script can share thattoo. thanks

$(document).ready(function () {     /* uploading profile background image */     $('body').on('change', '#bgphotoimg', function () {         $("#bgimageform").ajaxform({             target: '#timelinebackground',             beforesubmit: function () {},             success: function () {                  $("#timelineshade").hide();                 $("#bgimageform").hide();             },             error: function () {             }         }).submit();     });      /* banner position drag */     $("body").on('mouseover', '.headerimage', function () {         var y1 = $('#timelinebackground').height();         var y2 = $('.headerimage').height();         $(this).draggable({             scroll: false,             axis: "y",             drag: function (event, ui) {                 if (ui.position.top >= 0) {                     ui.position.top = 0;                 } else if (ui.position.top <= y1 - y2) {                     ui.position.top = y1 - y2;                 }             },             stop: function (event, ui) {}         });     });      /* bannert position save*/     $("body").on('click', '.bgsave', function () {         var id = $(this).attr("id");         var p = $("#timelinebgload").attr("style");         var y = p.split("top:");         var z = y[1].split(";");         var datastring = 'position=' + z[0];         $.ajax({             type: "post",             url: "image_savebg_ajax_bg.php",             data: datastring,             cache: false,             beforesend: function () {},             success: function (html) {                 if (html) {                     $(".bgimage").fadeout('slow');                     $(".bgsave").fadeout('slow');                     $("#timelineshade").fadein("slow");                     $("#timelinebgload").removeclass("headerimage");                     $("#timelinebgload").css({                         'margin-top': html                     });                     return false;                 }             }         });         return false;     }); }); 

$("body").on('click', '.bgsave', function () {     var id = $(this).attr("id");     var p = $("#timelinebgload").attr("style");     var y = p.split("top:");     var z = y[1].split(";");     var datastring = 'position=' + `z`[0]; 

you getting position here before ajax post php script, crudely getting 'top' css attribute inline style on #timelinebgload element.

if inspect dom when dragging #timelinebgload uidraggable updates top (and left) move around


Comments

Popular posts from this blog

c++ - Delete matches in OpenCV (Keypoints and descriptors) -

java - Could not locate OpenAL library -

sorting - opencl Bitonic sort with 64 bits keys -