Недавно поставили интересную задачу с которой как выяснилось справиться сам я не могу. А задача такая существует страница создания макета из картинок.
Картинки в макет грузятся заранее...
На самой страницы макета картинки нужно передвигать, и иметь возможность изменять их размер....
Вот что у меня получилось
http://eboard.technologik.ru/create.php?p=128
1) Проблема в том что я могу только уменьшать размер картинки
2) вторая проблема в том что разрешение экрана для которого все это нужно 1080 на 1920 и человек перемещая картинки на своем ноутбуке мало вероятно что поймет куда нужно перетащить картинку чтобы в дальнейшем она нормально отображалась на его экране в 1080 на 1920
в связи с этим я думал о не большем фрейме в верхнем углу экрана который был грузил в себя миниатюру данного экрана , или о возможности создать разметку( в виде картинки), пусть будет неудобно, но облегчит задачу....
Помогите доделать данную задачу.... (готов заплатить в разумных пределах)
все исходники готов предоставит :
вот сама страница :
// вывод всех картинок из базы данного макета, внутри //div(передвижение)
<?php
$id_maketa =$_GET['p'];
include ('blocks/bd.php');
$result2 = mysql_query("SELECT * FROM cartinki WHERE id_maketa='$id_maketa'");
$myrow2 = mysql_fetch_array($result2);
do {
list ($do, $razre) = split ('[.]', $myrow2['name']);
printf ("
<div id='drag%s' class='dv1' onclick='dd(drag%s)' widht='%spx' hieght='%spx' style='top:%spx; left:%spx; position: absolute;'>
<img id ='%s' src='%s' width='%spx' height='%spx' />
<input type='button' value='Изменить' onclick='CreateSize(%s)' /></div>
",$myrow2['id'],$myrow2['id'],$myrow2['sir'],$myrow2['vis'],$myrow2['sverhy'],$myrow2['sboky'],$myrow2['id'],$myrow2['url'],$myrow2['sir'],$myrow2['vis'],$myrow2['id']);
}
while ($myrow2 = mysql_fetch_array ($result2));
?>
//вот скрипт для crop
<script type="text/javascript">
//<![CDATA[
function CreateSize(ids) {
cropresizer.getObject(ids).init({
saveProportions : true,
onUpdate : function() {
var sirka = this.iWidth;
var visota = this.iHeight;
var id = ids;
$.ajax({
type: "POST",
url: "updatas2_img.php",
data: ({sirka:sirka,visota:visota,id:id}),
// Âûâîäèì òî ÷òî âåðíóë PHP
});
}
});
}
//]]>
</script>
// скрипт для drop
<script type="text/javascript">
function dd(lop){
$(lop).draggable({
cursor: "move",
stop: function(event, ui) {
var top = ui.offset.top;
var lefttt = ui.offset.left;
var id = this.id;
$.ajax({
type: "POST",
url: "updatas_img.php",
data: ({top:top,lefttt:lefttt,id:id}),
success: function(html) {
alert(html);
}
});
alert("Niauoea: " + event.type +
"\n\ntop: " + ui.offset.top +
" px\nleft: " + ui.offset.left +
" px"+this.id);
}
});
};
</script>
