Ciao a tutti ragazzi, devo spostare dei vestiti da una tabella ad un altra con l'ipad , il tutto funziona ma se provate ad andare sulla pagina vi accorgerete che la seconda colonna di immagini si sposta molto più in basso della prima e la terza colonna si sposta più in basso della seconda.
il sito è questo: http://idnob.altervista.org/creator.php (navigate con ipad)
Il codice è questo:
Ho messo in grassetto il position:relative perché penso che ci sia da modificare una proprietà di quel position, voglio ottenere le immagini della seconda e terza colonna che seguono il dito esattamente come la prima.
Spero di essere stato chiaro, grazie in anticipo!
il sito è questo: http://idnob.altervista.org/creator.php (navigate con ipad)
Il codice è questo:
Codice:
<html> <head>
<title>Intelligent Wardrobe</title>
<meta charset=utf-8 />
<title>Intelligent Wardrobe - Creator</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" />
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<style type="text/css">
.draggable {
position: relative;
}
</style>
</head>
<body>
<?php
//Connection
$link = mysql_connect('localhost', 'idnob', 'Zenemecca5689');
if (!$link) { die('Could not connect: ' . mysql_error()); }
//Select DB
mysql_select_db(my_idnob) or die ("Error in selection database ".mysql_error());
$query = "SELECT image FROM clothes WHERE position='Top'";
echo("<table bgcolor='FFCCFF'>");
echo(" <tr> <td><h3>Top</h3></td></tr>");
$result=mysql_query($query) or die ("Query Error".mysql_error());
//lef for top position
echo("<div class='table'>");
echo "<tr>";
while($row = mysql_fetch_array($result))
{
echo "<td bgcolor='FFCCFF'><img src='upload/" . $row['image'] . "' height='120' width='120' class='draggable' ></td>";
}
echo "</tr>";
echo ("</table>");
echo ("</div>");
//center for center position
echo("<div class='table'");
$query = "SELECT image FROM clothes WHERE position='Middle'";
echo("<table bgcolor='blue'>");
echo(" <tr> <td bgcolor='blue'><h3>Middle</h3></td></tr>");
$result=mysql_query($query) or die ("Query Error".mysql_error());
echo "<tr>";
while($row = mysql_fetch_array($result))
{
echo "<td bgcolor='blue'><img src='upload/" . $row['image'] . "' height='120' width='120' class='draggable' ></td>";
echo "<td> </td>";
}
echo "</tr>";
echo ("</table>");
echo ("</div>");
//right position
echo("<div class='table'>");
$query = "SELECT image FROM clothes WHERE position='Bottom'";
echo("<table bgcolor='3366FF'>");
echo(" <tr> <td><h3>Bottom</h3></td></tr>");
$result=mysql_query($query) or die ("Query Error".mysql_error());
echo "<tr>";
while($row = mysql_fetch_array($result))
{
echo "<td bgcolor='3366FF'><img src='upload/" . $row['image'] . "' height='120' width='120' class='draggable' ></td>";
}
echo "</tr>";
echo ("</table>");
echo ("</div>");
echo("<div id=\"digiclock\"></div>");
echo("<div align='center'>");
echo("<br><br><br><br><br><br><br><br><br><br><br><br><br>");
echo("<img src='files/stikman.jpg' height='300' width='300'");
echo("</div>");
echo("<a href='creator.php'><img src='files/reset.jpeg'></a>");
echo("<iframe width=\"400\" height=\"257\" scrolling=\"no\" frameborder=\"no\" noresize=\"noresize\" src=\"http://www.ilmeteo.it/box/previsioni.php?citta=10426&type=day1&width=400&ico=1&lang=eng&days=6&font=Verdana&fontsize=12&bg=FFFFFF&fg=000000&bgtitle=0099FF&fgtitle=FFFFFF&bgtab=F0F0F0&fglink=1773C2\"></iframe>");
?>
</body>
<script type="text/javascript">
$.fn.draggable = function() {
var offset = null;
var start = function(e) {
var orig = e.originalEvent;
var pos = $(this).position();
offset = {
x: orig.changedTouches[0].pageX - pos.left,
y: orig.changedTouches[0].pageY - pos.top
};
};
var moveMe = function(e) {
e.preventDefault();
var orig = e.originalEvent;
$(this).css({
top: orig.changedTouches[0].pageY - offset.y,
left: orig.changedTouches[0].pageX - offset.x
});
};
this.bind("touchstart", start);
this.bind("touchmove", moveMe);
};
$(".draggable").draggable();
</script>
</html>Spero di essere stato chiaro, grazie in anticipo!
