JSFiddle - React, Tailwind, and code Playground

by Nick Hulea

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<body>
    <div id="notice-dialog" title="Basic dialog">
        <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
    </div>
    <button id="opener">Open Dialog</button>
    <iframe width="300" scrolling="no" height="13" frameborder="0" allowtransparency="true" hspace="0" vspace="0" marginheight="0" marginwidth="0" src="http://googleads.g.doubleclick.net/pagead/viewthroughconversion/1000592525/?random=1381965510550&amp;cv=7&amp;fst=1381965510550&amp;num=1&amp;fmt=1&amp;label=R7pJCOuY-AMQjamP3QM&amp;guid=ON&amp;u_h=1200&amp;u_w=1920&amp;u_ah=1160&amp;u_aw=1920&amp;u_cd=24&amp;u_his=2&amp;u_tz=-420&amp;u_java=true&amp;u_nplug=23&amp;u_nmime=111&amp;url=http%3A//www.nhm.org/site/for-teachers/visit-the-museum/book-your-visit%23&amp;frm=0" title="Google conversion frame" name="google_conversion_frame" style="display none;"></iframe>
</body>

JavaScript

$(function () {
      $("#notice-dialog").dialog({
          autoOpen: false,
          //bgiframe: true,
          //modal: true,
          //position: top,
          closeOnEscape: false,
          draggable: false,
          width: 400
      });
      $("#opener").click(function () {
          $("#notice-dialog").dialog("open");
      });
  });