0
在我的拖放遊戲中，我目前有一種風格，向用戶顯示要拼寫的單詞，但沒有限制，以確保它們不會在其他任何地方放下字母，第一個單詞的單元格。突出顯示要完成的正確的信
我該如何去確保用戶只能在該單詞的第一個字母中放置一個字母？
或者是否有辦法讓拖放區中的任何字母向左滑動，以便它們按順序排列？
這裏是樣式應用到拼寫單詞的代碼...
$('#pickNext').click(function() {
// remove the class from all td's
$('td').removeClass('spellword');
// pick a random word
rndWord = shuffledWords.sort(function() {
return 0.8 - Math.random();
})[0];
// apply class to all cells containing a letter from that word
$('td[data-word="' + rndWord + '"]').addClass('spellword');
});
這裏是我拖累了腳本和滴...
$('.drag').draggable({
helper: 'clone',
snap: '.drop',
grid: [60, 60],
revert: function(droppable) {
if (droppable === false) {
return true;
}
else {
return false;
}
}
});
$(".drop").droppable({
drop: function(event, ui) {
word = $(this).data('word');
guesses[word].push($(ui.draggable).attr('data-letter'));
console.log($(event));
console.log($(ui.draggable).text());
console.log('CHECKING : ' + $(this).text() + ' against ' + $(ui.draggable).text().trim());
if ($(this).text() == $(ui.draggable).text().trim()) {
$(this).addClass('wordglow3');
} else {
$(this).addClass('wordglow');
}
console.log('CHECKING : ' + $(this).text() + ' against ' + $(ui.draggable).text().trim());
console.log(guesses);
if (guesses[word].length == 3) {
if (guesses[word].join('') == word) {
$('td[data-word=' + word + ']').addClass('wordglow2');
} else {
$('td[data-word=' + word + ']').addClass("wordglow4");
guesses[word].splice(0, guesses[word].length);
}
}
},
的風格是應用將是...
.spellLetter {
-webkit-box-shadow: inset 20px 0px 10px 5px #176BC9;
box-shadow: inset 0px 0px 10px 5px #176BC9;
}
謝謝。
我認爲最好的辦法可能是剛剛不小心其中用戶把信，並把它放在他/她應該把它。因此，即使用戶將該字母作爲最後一個字母放下，您也可以將它放到正確的位置。 – hayavuk 2012-07-25 12:57:21
@bvukelic我該怎麼做？ – m0onio 2012-07-25 13:32:28