как изменить положение div при нажатии на него и переместить его, как это было при нажатии на него в другой раз?

0

Я пытаюсь нажать на div 15, чтобы переместить его в позицию скрытого div, и наоборот для скрытого Div, когда нажимаем на скрытое Div, переместите его в положение Div 15, как было.

Jsfiddle: http://jsfiddle.net/6paRL/12/

HTML

<div id="numbers15">15</div>
<div id="hidden"></div>

Javascript

$(document).ready(function()
{
    $("#numbers15").click(function()
    {
        $("#numbers15").animate(
        {
            'left': '195px',
            'top': '195px'
        })

        $("#hidden").animate(
        {
            'left': '134px',
            'top': '195px'
        }) 
    })
});
  • 0
    Я уже модифицировал
Теги:

3 ответа

2
Лучший ответ

Проверьте это решение: http://jsfiddle.net/6paRL/13/

$(document).ready(function(){
$("#numbers15").click(function(){
      if ( $(this).hasClass('after')){
        $(this).removeClass('after');
        $("#numbers15").animate({
          'left': '134px',
           'top': '195px'
        });
        $("#hidden").animate({
          'left': '195px',
          'top': '195px'
        });            
     }else{
        $(this).addClass('after');
        $("#numbers15").animate({
          'left': '195px',
          'top': '195px'
        });
        $("#hidden").animate({
          'left': '134px',
          'top': '195px'
        });
     }
  })
});
Поделиться
  • 0
    Может быть, объяснить, что вы делаете? Стена кода и jsfiddle не очень хороший ответ.
  • 0
    Я минималист Это очень простой код, поэтому, думаю, объяснять нечего. Если что-то непонятно, я сделаю, но не до этого. Как вы думаете, что я должен объяснить, добавитьClass, анимировать или повторить функцию другим способом (обратный путь)?
Показать ещё 2 комментария
0

Я думаю, вы могли бы сделать что-то вроде этого

$(document).ready(function(){
    $("#numbers15").click(function(){
        var l1=$("#numbers15").css('left')=='134px'?'195px':'134px';
        var l2=$("#hidden").css('left')=='134px'?'195px':'134px';
    $("#numbers15").animate({
        'left': l1,
         'top': '195px'
  })
    $("#hidden").animate({
        'left': l2,
         'top': '195px'
  })
  })
});

Рабочий ДЕМО

Надеюсь, это поможет, спасибо

Поделиться
  • 0
    Вы могли бы попробовать этот простой подход
0

Я бы использовал атрибут данных для каждого div, содержащего исходную позицию.
Пример:

<div id="numbers15" data-posX="20" data-posY="20">

Чем, onclick, вы добавляете класс.
Если у div еще нет класса, выполните оригинальную анимацию.
если он есть, чем сделать анимацию с атрибутами данных.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню