Witam,
Próbuję stworzyć prostą grę na zasadzie puzli.
wygląda to wstępnie tak:
grachodzi o ułożenie poprzez przesuwanie obrazu, nie bardzo wiem jednak jak sprawdzić czy obraz jest prawidłowo ułożony.
kod wygląda następująco:
<img src="images/1/1_02.jpg" id="2" class="sortableitem" /> <img src="images/1/1_03.jpg" id="3" class="sortableitem" /> <img src="images/1/1_04.jpg" id="4" class="sortableitem" /> <img src="images/1/1_05.jpg" id="5" class="sortableitem" /> <img src="images/1/1_09.jpg" id="9" class="sortableitem" /> <img src="images/1/1_10.jpg" id="10" class="sortableitem" /> <img src="images/1/1_13.jpg" id="13" class="sortableitem" /> <img src="images/1/1_14.jpg" id="14" class="sortableitem" /> <img src="images/1/1_15.jpg" id="15" class="sortableitem" /> <img src="images/1/1_08.jpg" id="8" class="sortableitem" /> <img src="images/1/1_01.jpg" id="1" class="sortableitem" /> <img src="images/1/1_12.jpg" id="12" class="sortableitem" /> <img src="images/1/1_06.jpg" id="6" class="sortableitem" /> <img src="images/1/1_16.jpg" id="16" class="sortableitem" /> <img src="images/1/1_11.jpg" id="11" class="sortableitem" /> <img src="images/1/1_07.jpg" id="7" class="sortableitem" /> <script type="text/javascript"> function executeTimer()
{
var time = parseInt($("#time").text());
if (time-1 > -1)
{
$("#time").text(time-1);
return false;
}
window.clearInterval(gameTimer);
gameOver = true;
if (gameOver)
{
$("div").addClass("div1").hide("slow");
};
}
<script type="text/javascript"> $(document).ready(
function () {
$('div').Sortable(
{
accept : 'sortableitem',
helperclass : 'sorthelper',
activeclass : 'sortableactive',
hoverclass : 'sortablehover',
opacity: 0.8,
revert: true,
floats: true,
tolerance: 'pointer'
}
)
gameTimer = window.setInterval("executeTimer()", 1000);
}
);
może ktoś ma jakieś propozycję jak rozwiązać ten problem ?