Question

我不知道我在用jQuery做什么。我试图一个接一个地动词。

例如：

左侧的单词（看不见）会在滑入时淡入，而另一个单词会从右侧滑入幻灯片。然后两个单词都会淡出，一组新单词也会这样做。这是我到目前为止的热点：

$(function() {
    $('.fadel').animate({
        left: '250px'
    }, 3575, function() {
        $(this).fadeOut();
    });

    $('.fader').animate({
        right: '250px'
    }, 3575, function() {
        $(this).fadeIn();
        $(this).fadeOut();
    });

});

非常感谢任何帮助。提前谢谢！

Answer 1

http://jsfiddle.net/xPXqV/1/

$(function()
{
  var num = 0;
  var words =
  [
    {left: "foo", right: "bar"},
    {left: "holy", right: "crap"},
    {left: "train", right: "spotting"}
  ];    

  var fadel = $('#fadeL');
  var fader = $('#fadeR');

  animate();

  function animate()
  {
    var leftword = words[num].left;
    var rightword = words[num].right;

    fadel
        .stop()
        .css('left', '0px')
        .css('opacity', 0)
        .text(leftword).show();

    fader
        .stop()
        .css('left', '500px')
        .css('opacity', 0)
        .text(rightword).show();
    fadel.animate({
        opacity: 1,
        left: (250 - fadel.width()) + 'px'
    }, 3575, function() {
        fadel.fadeOut("slow", function()
        {
            queueNext();
        });
    });

    fader.animate({
        opacity: 1,
        left: '250px'
    }, 3575, function() {  
        fader.fadeOut("slow");
    });
}

function queueNext()
{
    if (++num == words.length)
        num = 0;

    animate();
}

}）;

用jQuery动画单词

1 个答案: