3 Replies - 1785 Views - Last Post: 25 February 2014 - 01:10 PM

#1 agustrong  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 25-February 14

i want to change numbers to image from this jquery code

Posted 25 February 2014 - 12:44 PM

<script type="text/javascript">
    var correctCards = 0;
    $(init);

    function init() {
        var numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
        numbers.sort(function () {
            return Math.random() - .5
        });
        for (var i = 0; i < 9; i++) {
            $('<div>' + numbers[i] + '</div>').data('number', numbers[i]).attr('id', 'card' + numbers[i]).appendTo('#cardPile').draggable({
                containment: '#content',
                stack: '#cardPile div',
                cursor: 'move',
                revert: true
            });
        }
        var words = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten'];
        for (var i = 1; i <= 9; i++) {
            $('<div>' + words[i - 1] + '</div>').data('number', i).appendTo('#cardSlots').droppable({
                accept: '#cardPile div',
                hoverClass: 'hovered',
                drop: handleCardDrop
            });
        }
    }

    function handleCardDrop(event, ui) {
        var slotNumber = $(this).data('number');
        var cardNumber = ui.draggable.data('number');
        if (slotNumber == cardNumber) {
            ui.draggable.addClass('correct');
            ui.draggable.draggable('disable');
            $(this).droppable('disable');
            ui.draggable.position({
                of: $(this),
                my: 'left top',
                at: 'left top'
            });
            ui.draggable.draggable('option', 'revert', false);
            correctCards++;
        }
        if (correctCards == 9) {
            $('#successMessage').show();
            $('#successMessage').animate({
                left: '380px',
                top: '200px',
                width: '400px',
                height: '100px',
                opacity: 1
            });
        }
    }
</script>
<----html-->
    <div id="content">
        <div id="cardPile"></div>
        <div id="cardSlots"></div>
    </div>


i found from this site http://www.elated.co...ssential-guide/
i want to change number 1 to 10 to images

This post has been edited by modi123_1: 25 February 2014 - 12:52 PM
Reason for edit:: please use code tags


Is This A Good Question/Topic? 0
  • +

Replies To: i want to change numbers to image from this jquery code

#2 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9418
  • View blog
  • Posts: 35,396
  • Joined: 12-June 08

Re: i want to change numbers to image from this jquery code

Posted 25 February 2014 - 12:53 PM

Why? Why not just display the images based on the numeric value?
Was This Post Helpful? 0
  • +
  • -

#3 agustrong  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 25-February 14

Re: i want to change numbers to image from this jquery code

Posted 25 February 2014 - 01:03 PM

View Postmodi123_1, on 25 February 2014 - 12:53 PM, said:

Why? Why not just display the images based on the numeric value?


i don't know how, can you give me sample code? pls
Was This Post Helpful? 0
  • +
  • -

#4 modi123_1  Icon User is online

  • Suitor #2
  • member icon



Reputation: 9418
  • View blog
  • Posts: 35,396
  • Joined: 12-June 08

Re: i want to change numbers to image from this jquery code

Posted 25 February 2014 - 01:10 PM

Quote

i don't know how, can you give me sample code? pls

Re-read the rules about having a good faith effort, on your part, and not asking folks for the code.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1