0
Я пытаюсь сделать наложение поверх изображения во время перетаскивания, но его также движущееся изображение, когда я перемещаю свое текстовое поле. Поэтому я хочу, чтобы область редактирования была прозрачной и накладываемой. Пожалуйста, помогитеКак сделать перетаскиваемый элемент наложением поверх изображения
Вот что у меня есть
<head>
<style>
.positionable {
width:100px; height:100px;
position:absolute;
}
.dragRegion {
background-color:#FFF; color:#000;
cursor:move;
top: -2px; left: -2px;
position: absolute;
font-size:14px; line-height:14px;
margin: -5px;
padding-left: 10px;
padding-top: 10px;
background-image:url('arrow_move.png');
background-repeat:no-repeat;
}
.editable {
width: 150px; height: 150px; padding: 0.5em;
position:relative;
}
</style>
</head>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js" type="text/javascript"></script>
<div class="positionable">
<div class="dragRegion"/>
<textarea id="resizable" rows="5" cols="20"></textarea>
<img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif" style="z-index: 100" />
<script type="text/javascript">
$('.positionable').draggable({handle: '.dragRegion'});
$('.editable').resizable();
</script>
</div>
Спасибо, но это не работает –
О, я думаю, что я missunderstod вас. Но позиционируемый объект делает изображение привлекательным. Поэтому вы должны закрыть его перед изображением: Проверьте этот, http://jsbin.com/apocid/edit#javascript,html –
Спасибо, Фантастический! –