Создание забавного небольшого занятия для сайта моей дочери 1-го класса школы.
У меня есть несколько фотографий в div, которые дети могут перемещать в виртуальной гостиной, используя Jquery Draggable и Droppable, но моя проблема возникает из-заЯ хочу получить изображение лампочки png (# bulb1) при перетаскивании на лампу (# lamp1), когда фоновое изображение bulb-off.png из (# bulb1) изменится на изображение bulb-on.png после его включения (#lamp1).
Теперь я могу изменить фоновое изображение, у меня есть всплывающая подсказка, которая показывает словарь для обучения детей, но у меня, похоже, нет возможности удалить выбранное изображение таким же образомон был помещен, и с текущими настройками подсказка остановится ... Кажется, теперь немного грязно.
Я много читал на сайте Jquery, но не вижу ничего, что могло бы меня подставитьна пути, чтобы это заработало.
По сути, я вернулся в самом начале (вычистил мой кодовый беспорядок).
<script type="text/javascript">
$(document).ready(function () {
$( '#bulb1' ).draggable({
containment: '.shelf',
helper: 'clone'
});
$( '#lamp1, #laml2, #lamp3).droppable({
drop: function( event, ui ) {
$(this).css('background-image', 'url(images/bulb-on.png)').tooltip();
},
out: function( event, ui ) {
$(this).css('background-image', 'url(images/bulb-off-off.png)');
}
});
});
</script>
Любая помощь будет отличной!
Спасибо,
Алан