Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   div в границе div (https://javascript.ru/forum/dom-window/40332-div-v-granice-div.html)

valyan 01.08.2013 10:26

div в границе div
 
Здравствуйте. Есть два div`a.
<div id="YMapsID" >
  <div id="dialog" title="Basic dialog">
    <input type="button" id="EditBtn" style="width: 100px;" value="Править"/>
    <input type="button" id="ApplyBtn" style="width: 100px;" value="Готово"/>
  </div>
</div>


#YMapsID 
{
    border: 1px solid silver;
    width: 80%;
    overflow: auto; 
    height:90%;
    float: left;
    z-index:1;
}

#dialog
{
	 
	border: 1px solid silver;
	margin: auto; 
	padding: 10px; 
	border-radius:10px;
	width : 250;
	position:absolute;
	z-index: 999;
	height:500px;
	display: none;
	background: rgba(220, 220, 220, 0.75);
}

Сейчас второй див (#dialog) поверх первого (#YMapsID), второй див перемещается по всей странице. Как сделать чтобы второй див(#dialog) перемещался только впределах первого (#YMapsID). Для перемещения использую jquery.easydrag.js.

ОлегА 01.08.2013 10:29

используйте плагин jquery Draggable там есть такая возможность

valyan 01.08.2013 10:59

Цитата:

Сообщение от ОлегА (Сообщение 265382)
используйте плагин jquery Draggable там есть такая возможность

В <head> добавил
<script type="text/javascript" src="api/js/jquery-ui-1.10.3.custom.js"></script>
<script>
$(function () {
  $("#dialog").draggable({
  containment: "YMapsID"
  });
 });
</script>

Но все равно перемещается по всей странице.

ОлегА 01.08.2013 11:43

по моему так

$(function () {
  $("#dialog").draggable({
  containment: "#YMapsID"
  });
 });

valyan 01.08.2013 11:53

Цитата:

Сообщение от ОлегА (Сообщение 265390)
по моему так

$(function () {
  $("#dialog").draggable({
  containment: "#YMapsID"
  });
 });

Вот ведь невнимательность:) . Спасибо!!!
А еще вопрос - как можно сделать, чтобы второй див(#dialog) был по центру по правому краю первого (#YMapsID)?


Часовой пояс GMT +3, время: 21:41.