Is it possible to convert this JQuery code to JavaScript?

Question

The following code, from the Google-Caja playground,shows two boxes. And once you drag on inside the other the enclosing box changes color:

<style>
  #draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
  #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
 <script>
  $(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
      drop: function( event, ui ) {
        $( this )
          .addClass( "ui-state-highlight" )
          .find( "p" )
            .html( "Dropped!" );
      }
    });
  });
  </script>

"Is it possible to convert this JQuery code to JavaScript?" Of course. jQuery is a library built with JavaScript. There's nothing you can do with jQuery you can't do without it. I'm not saying I'd recommend it, though; jQuery (and other libraries) exist for a reason. ;-) — T.J. Crowder
– T.J. Crowder, Commented Apr 27, 2012 at 16:12
@Wiseguy - Yes, that's what I meant. But maybe it was a little naive of me? Thanks! — Caffeinated
– Caffeinated, Commented Apr 27, 2012 at 16:13

GillesC · Accepted Answer · 2012-04-27 16:12:38Z

4

Yes it is with a bit of work. The find, addClass and html ones are easy but the drag and drop is another story. here is a tutorial for it http://luke.breuer.com/tutorial/javascript-drag-and-drop-tutorial.aspx

answered Apr 27, 2012 at 16:12

GillesC

10.9k3 gold badges42 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Oleg V. Volkov · Accepted Answer · 2012-04-27 16:12:23Z

1

Yes. You can convert absolutely any JavaScript library code to pure JS, since that's what they use after all.

answered Apr 27, 2012 at 16:12

Oleg V. Volkov

22.6k4 gold badges49 silver badges68 bronze badges

Comments

Matthew Darnell · Accepted Answer · 2012-04-27 16:14:26Z

1

It's possible, but the .draggable() and .droppable() functions are much too complicated to explain how to do it here. Look at the unminified jQuery UI. That will give you a good start (although it will still be using jQuery).

answered Apr 27, 2012 at 16:14

Matthew Darnell

4,5862 gold badges22 silver badges30 bronze badges

1 Comment

Caffeinated Over a year ago

Thanks a lot! I'm looking up " unminified jQuery UI" right now.

Collectives™ on Stack Overflow

Is it possible to convert this JQuery code to JavaScript?

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related