Цифровое Железо

Меню навигации

Пользовательские ссылки

Активные темы

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.

Вы здесь » Цифровое Железо » portal3

portal3

div.drag:hover {cursor: move;}
       #dragredaktor1, #dragredaktor2 {min-width: 150px;min-height:200px;margin:10px;}
        </style>
		
<style type='text/css'>
  .wrapper{margin:20px auto}
  #block1 {position: fixed;margin:10px;z-index:1000;float:left;}
  #block1,.trash{border:solid 1px #555555;padding:20px;-moz-border-radius:5px;-webkit-border-radius:5px;min-height:335px ;min-width:100px}
  .textBlock{cursor: pointer;border:solid 1px #333333;font-weight:bold;margin:10px 0 5px 0;padding:10px;text-align:center;background:#eee;-moz-border-radius:3px;-webkit-border-radius:3px}
  .trash{padding:0px;
    width:98%;min-height:100px ;
    background-color: #4169E1;
	margin:10px auto !important;
  }
  .trash div{
      width:80% !important;height:40px ;
      background-color:  #DEB887;
      position: relative !important;
margin:10px auto;
  }
 .trash {position: relative;} 
  </style>
<script type='text/javascript'>
$(window).load(function () {
$('.trash').sortable({connectWith: '.trash'});
    $("#block1 .textBlock").draggable({
connectToSortable: ".trash",
		helper: "clone"

});
   $(".trash").droppable({
        accept: "#block1 .textBlock",
        drop: function (event, ui) {
            var element = $(ui.draggable).clone();

element.draggable({ containment:".trash", scroll:false });
        }
    })

});
</script>

<div class="wrapper">
        <div id="block1" class="">
            <div class="textBlock ui-state-default">Блок 1</div>
            <div class="textBlock ui-state-default">Блок 2</div>
            <div class="textBlock ui-state-default">Блок 3</div>
			<div class="textBlock ui-state-default">Блок 4</div>
            <div class="textBlock ui-state-default">Блок 5</div>
            <div class="textBlock ui-state-default">Блок 6</div>
        </div>
<table class="droptable">
<tr><td class="drop dropshapka" colspan="3"><div>Шапка</div>
<div class="trash "></div>
</td></tr>
<tr>
<td class="drop dropleft"><div>Правая колонка</div>
<div class="trash "></div>
</td>
<td class="drop dropcenter"><div>Центр</div>
<div class="trash "></div>
</td>
<td class="drop dropright"><div>Левая колонка</div>
<div class="trash "></div>
</td>
</tr>
<tr><td class="drop dropfuter" colspan="3"><div>Футер</div>
<div class="trash "></div>
</td>
</tr>
</table> 
     </div>

Вы здесь » Цифровое Железо » portal3