javascript - Jquery put element inside another not after -

-

i have few images , element can drag , drop on images 

<span name="imie" id="drag1" class="drag">     <img name='aa' id='test' src="http://placehold.it/80x80/c9112d/fff&text=1" width="70px" height="20px" />     </span>     <span>imię</span>   <div class="col droppable">     <div class="canvas">         <img class="img-bg" src="test.jpg">     </div>     <div class="canvas">         <img class="img-bg" src="test.jpg">     </div>                     </div>

i want add dropped box inside <div class="canvas"> after or before img. want see box on img in code should inside canvas not after script

 var counter = 0;         var x = null;         //make element draggable         $(".drag").draggable({             helper: 'clone',             cursor: 'move',             tolerance: 'fit',             revert: true         });          $(".droppable").droppable({             accept: '.drag',             activeclass: "drop-area",             drop: function (e, ui) {                 if ($(ui.draggable)[0].id !== "") {                       x = ui.helper.clone();                     ui.helper.remove();                     x.draggable({                         helper: 'original',                         cursor: 'move',                         containment: '.droppable',                         tolerance: 'fit',                         drop: function (event, ui) {                             $(ui.draggable).remove();                         }                     });                       x.addclass('remove');                      var el = $("<span><a href='javascript:void(0)' class='xicon delete'                  title='remove'</a>x</span>");                     $(el).insertafter($(x.find('img')));                     x.appendto('.droppable');                     $('.delete').on('click', function () {                         $(this).parent().parent('span').remove();                     });                     $('.delete').parent().parent('span').dblclick(function () {                         $(this).remove();                     });                 }             }         });

i suppose problem in x.appendto('.droppable'); . can't handle it. , whole example online here

you have make <div class="canvas"></div> droppable not <div class="col droppable"></div>

try:

html:

<div class="col ">     <div class="canvas droppable">         <img class="img-bg" src="http://formularze.iform.pl/zdjecia/formularze/4556/sf_sdfra.gif">     </div>     <div class="canvas droppable">         <img class="img-bg" src="http://formularze.iform.pl/zdjecia/formularze/4556/sf_sdfra.gif">     </div>                     </div>

js: 

$(this).append(x);

demo

or if want before img try:

$(this).prepend(x);

demo2


Comments

Post a Comment

Popular posts from this blog

java - WrongTypeOfReturnValue exception thrown when unit testing using mockito -

-
my test list<person> mylist; @test public void testisvalidperson() { mylist = new arraylist<person>(); mylist.add(new person("tom")); when(persondao.get(person)).thenreturn(mylist); when((persondao.get(person)).isempty()).thenreturn(false);//------exception thrown boolean result = service.isvalid("tom"); assertfalse(result); } method tested: public boolean isvalid(string person){ persondao = new persondao(); person personobj = new person(person); return (persondao.get(person).isempty())?false : true; } exception thrown: org.mockito.exceptions.misusing.wrongtypeofreturnvalue: boolean cannot returned get() get() should return list *** if you're unsure why you're getting above error read on. due nature of syntax above problem might occur because: 1. exception *might* occur in wrongly written multi-threaded tests. please refer mockito faq on limitations of concurrency testing. 2. sp
Read more

php - Magento - Deleted Base url key -

-
i working on cleaning url: http://mydomain.com/shop/shop/deals i going through settings in configuration tab in admin panel on magento , change secure , unsecure base urls remove first base url "shop" web page read: http://mydomain.com/shop/deals so changed unsecure base urls mydomain.com/shop mydomain.com , secure 12.345.67.89/shop 12.345.67.89. wrong thing do. i cannot reload page or admin console. how access these files through ftp , change correctly there?? when make changes in admin panel changes made in database not in file. have make changes in database. 1.go database , select core_config_data table under table find web/unsecure/base_url , web/secure/base_url . make changes here. don't forget clear cache in var/cache folder
Read more

android - How to disable Button if EditText is empty ? -

-
i have edittext , button in application. when button clicked,the text entered in edittext added listview. i want disable button if edittext empty.how ? this code button click imagebutton imb=(imagebutton)findviewbyid(r.id.btn_send); imb.setonclicklistener(new onclicklistener() { @override public void onclick(view arg0) { edittext et = (edittext)findviewbyid(r.id.edittext1); string str = et.gettext().tostring(); web1.add(str); toast.maketext(shoutsingleprogram.this, "you entered...."+str, toast.length_short).show(); adapter1.notifydatasetchanged(); et.settext(""); } }); } how can ? edittext1.addtextchangedlistener(new textwatcher() { @override public void ontextchanged(charsequence s, int start, int before, in
Read more