jquery animeted on multi thread

анимированная функция jquery, работающая с несколькими потоками?

Здесь, в моем коде ... предположим, что я нажимаю верхнюю кнопку, а функция вызова работает нормально ....

теперь нажмите любой оставшийся один раз .... Вторая функция также работает, но с 1-го вызова также.

так, как я могу назвать одну функцию за раз?

это многопроцессорный способ убить?

<table width="1200px" height="600px" align="center">
        <tr>
            <td>
            </td>
            <td style="text-align: center">
                <button id="btntop">
                    top</button>
            </td>
            <td>
            </td>
        </tr>
        <tr>
            <td style="text-align: right">
                <button id="btnleft">
                    left</button>
            </td>
            <td style="text-align: center">

                

            </td>
            <td>
                <button id="btnright">
                    right</button>
            </td>
        </tr>
        <tr>
            <td>
            </td>
            <td style="text-align: center">
                <button id="btnbottom">
                    bottom</button>
            </td>
            <td>
            </td>
        </tr>
    </table>
    <script type="text/javascript">


        function anim(direction) {


            if (direction == "top") {

                $('#book').animate({

                    top: '-=10'

                }, 200, function() {


                        anim("top");

                });

            }

            if (direction == "left") {
                $('#book').animate({

                    left: '-=10'
                }, 200, function() {

                        anim("left");

                });
            }

            if (direction == "right") {
                $('#book').animate({

                    left: '+=10'
                }, 200, function() {

                        anim("right");

                });
            }

            if (direction == "bottom") {
                $('#book').animate({

                    top: '+=10'
                }, 200, function() {

                        anim("bottom");

                });
            }
        }


        $('#btntop').hover(function() {

            anim("top");

        });


        $('#btnleft').hover(function() {

            anim("left");

        });

        $('#btnright').hover(function() {


            anim("right");

        });

        $('#btnbottom').hover(function() {


            anim("bottom");

        });


    </script>
2
nl ja de

1 ответы

Вы вызываете функцию anim() в hover() , что не очень хорошо. Вместо этого измените его на click() .

Что касается второй части, добавьте в $ ('# book'). Stop (true); перед вызовом anim() в каждом из ваших 4-х кнопок-обработчиков:

$('#btntop').click(function() {
    $('#book').stop(true);
    anim("top");
});

$('#btnleft').click(function() {
    $('#book').stop(true);
    anim("left");
});

$('#btnright').click(function() {
    $('#book').stop(true);
    anim("right");
});

$('#btnbottom').click(function() {
    $('#book').stop(true);
    anim("bottom");
});

Он остановит все текущие анимации и запустит новую.

1
добавлено
Нет, не так, насколько я знаю. Посмотрите stackoverflow.com/a/1663144/295852
добавлено автор boz, источник
bro ... jQuery работает над несколькими потоками?
добавлено автор Kvadiyatar, источник
Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda