<{if $WebID}>
  <{if $config}>
    <script>
      $(function() {
        $( "#head_bg" ).draggable({
          axis: "y",
          cursor:"move",
          stop: function(e, ui) {
            var top = ui.position.top;
            var left = ui.position.left;

            $.post("config_ajax.php", {op: "save_head_bg", WebID: <{$WebID}> , head_top: top, head_left: left });
          }});

        $( "#tad_web_logo" ).draggable({
          cursor:"move",
          stop: function(e, ui) {
            var top = ui.position.top;
            var left = ui.position.left;

            $.post("config_ajax.php", {op: "save_logo", WebID: <{$WebID}> , logo_top: top, logo_left: left });
          }});
      });
    </script>

    <div class="well" id="web_head" style="height: 200px; overflow: hidden; padding: 0px; position: relative; border: 2px dashed red;">
      <img src="<{$xoops_url}>/uploads/tad_web/<{$WebID}>/head/<{$web_head}>" alt="head bg" id="head_bg" style="margin: 0px; width: 100%; position: absolute; z-index: 0; top: <{$head_top}>px; left: <{$head_left}>px;">
      <a href="index.php?WebID=<{$WebID}>"><img src="<{$xoops_url}>/uploads/tad_web/<{$WebID}>/logo/<{$web_logo}>" alt="web log" id="tad_web_logo" class="draggable" style="position: absolute; z-index: 1; top: <{$logo_top}>px; left: <{$logo_left}>px;"></a>
    </div>
  <{else}>
      <a href="index.php?WebID=<{$WebID}>"><img src="<{$xoops_url}>/uploads/tad_web/<{$WebID}>/header.png" alt="<{$WebTitle}>" title="<{$WebTitle}>" id="head_bg" class="img-rounded img-responsive" style="margin-bottom: 10px;"></a>
  <{/if}>
<{/if}>