-4

これが私の問題です:

  1. ユーザーがボタンAをタップします。
  2. これにより、jQueryアニメーションの非表示ボタンAがトリガーされます。
  3. このアニメーションが完了すると、ボタンBがjQueryアニメーションによってまったく同じ位置に表示されます。
  4. jQueryは、ボタンBがタップされたかのように機能します。

これは私には非常に奇妙に思え、ひどいユーザーエクスペリエンスを引き起こしています。誰かが私がこれを修正するのを手伝ってもらえますか?これがjavascriptコードですが、jQueryの一般的な問題だと思います。

function showbuttonB(element){
   $(element).animate({ opacity: '0', marginRight: '-50px'}, 230, function(){
      $(element).append("<span class='buttonB'><a href='mailto:XXXXXXXX'><div class='icon'>ButtonB</div></a></span>");
      $(element).find('.buttonB').animate({
         display: 'toggle',
         marginRight: '0px'
      }, 230);
   });
}

$(".buttonA").live('touchend mouseup', function() {
  showbuttonB(this);
});

およびHTML:

<div class="buttonA">ButtonA</div>
4

1 に答える 1

0

bButtonがクリックされたようには機能しません。問題は、新しいボタンが非表示の要素内にあることです。

この動作するフィドルを確認してください

コード:

function showbuttonB(element) {
    $(element).animate({
        opacity: '0',
        marginRight: '-50px'
    }, 230, function() {
        $('#foo').append("<span class='buttonB'><a href='mailto:XXXXXXXX'><div class='icon'>ButtonB</div></a></span>");
        $('#foo').find('.buttonB').animate({
            display: 'toggle',
            marginRight: '0px'
        }, 230);
    });
}

$(".buttonA").live('touchend mouseup', function() {
    showbuttonB(this);
});​

HTML:

<div class="buttonA">ButtonA</div>
<span id="foo"> </span>

</ p>

于 2012-04-08T00:05:26.480 に答える