Resizable reloads page

jQuery resizable UI part causes unwanted page reload

by Emmett Culley

HTML

<body>
<div id="main" class="grad_target" >
  <div class="edit_btn_slide" >
    <span id="edit_slide_btn" class="edit_button" onclick="$('#main_dialog').dialog('open'); $('.edit_btn_frame').css('display', 'none')" title="Edit slide configuration" /><img src="images/edit.png" alt="edit" /></span>
        &nbsp;&nbsp;
    <span id="add_text_btn" class="edit_button" onclick="window.location='slide-preview-test.php?edit&pid=34&add_text'" title="Add text element" /><img src="images/add-text.png" alt="add text" /></span>
        &nbsp;&nbsp;
    <span id="add_img_btn" class="edit_button" onclick="window.location='slide-preview-test.php?edit&pid=34&add_gr'" title="Add image element" /><img src="images/add-img.png" alt="add image" /></span>
<!--      &nbsp;&nbsp;
    <span onclick="return askDeleteSlide()" /><img src="images/copy.png" alt="delete" /></span>
      &nbsp;&nbsp;
    <span onclick="return askDeleteSlide()" /><img src="images/del.png" alt="delete" /></span>-->
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <span id="message"></span>
  </div>
  <div class="main_dialog" id="main_dialog" style="display: none;" >
    <form name="slide_form" method="POST" action="slide-preview-test.php" >
    <input type="hidden" name="pid" value="34" />
    <input type="hidden" name="frame_cnt" value="1" />
    <table width="100%" >
      <tr>
        <td>
      <input type="hidden" name="was_active" value="Y" />
      <input type="hidden" name="old_to" value="3" />
          <table class="form" width="100%" cellpadding="2" cellspacing="0" style="line-height: 2em" ><col width="15%" /><col width=85%" />
            <tr>
              <td class="label" >Slide name:</td>
              <td class="field" >
                <input type="text" name="name" value="Social hall slide 1" size="30" maxlength="64" />
              </td>
            </tr>
            <tr>
              <td class="label" >Description:</td>
              <td class="field" >
                <input type="text"...

CSS

BODY {
  background-color: #00ffff;
  padding: 0;
  margin: 0;
}
#main {
  position: relative;
  top: 0;
  padding: 0;
  margin: 0;
  margin: auto;
  border: dotted thin black;
 width: 1024px;
 height: 768px;
}
#fr_blk_0 {
  position: absolute;
  width: 275px;
  height: 87px;
  top: 100px;
  left: 100px;
  display:block;
  z-index: 120;
  border: solid thin black;
  z-index: 140;
}
#fr_button_0 {
  position: absolute;
  z-index: 130;
}
#fr_content_0 {
  position: absolute;
  overflow: hidden;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 120;
}
#fr_bkgnd_0 {
  position: absolute;
  top: 0;
  width: 274px;
  height: 86px;
  z-index: 110;
}
#fr_edit_wrapper {
  position: absolute;
  margin: 5px;
  display: none;
}

.fr_edit_dialog {
  position: absolute;
  margin:5px;
  top: 0;
  z-index: 100;
}
#edit_btn {
  position: relative;
  z-index: 1000;
}
#edit_slide_btn {
  position: relative;
  z-index: 1000;
}
#add_img_btn {
  position: relative;
  z-index: 1000;
}
#add_text_btn {
  position: relative;
  z-index: 1000;
}
.edit_btn_frame {
  position: relative;
  background-color: rgba(99,99,99,0.5);
  padding: 9px 6px 6px 6px;
}
.edit_btn_slide {
  position: relative;
  background-color: rgba(99,99,99,0.5);
  padding: 9px 6px 6px 6px;
  xwidth: 85px;
}
.edit_button {
  cursor: pointer;
}
.ui-resizable { position: relative;}
.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;}
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0px; }
.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0px; }
.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0px; height: 100%; }
.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0px; height: 100%; }
.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: -5px; bottom: -5px;...

JavaScript

$().ready(function () {
    $('#fr_blk_0').resizable({
        resize: function (e, ui) {
            $('#fr_bkgnd_0').height(ui.size.height);
            $('#fr_bkgnd_0').width(ui.size.width);
        },
        handles: 'all',
        stop: function (e, ui) {
            alert('Stopped resizing at ' + ui.size.width + 'x' + ui.size.height);
            //      $.get ('fill-slide.php', { sid: 1270, attr: 'sz', container: 'fr_blk_0', width: ui.size.width , height: ui.size.height });
        }
    });
    $('#fr_blk_0').draggable({
        stop: function (e, ui) {
            alert('Stopped dragging at ' + ui.position.top + '.' + ui.position.left);
            //      $.get ('fill-slide.php', { sid: 1270, attr: 'pos', container: 'fr_blk_0', left: ui.position.left, top: ui.position.top });
        }
    });
});