获取要从右侧而不是从顶部滑入的文本

Get text to slide in from right instead of from top

本文关键字：顶部 文本 获取      更新时间：2023-09-26

我从 Slide 而不是 Fade 中获取了代码，我试图让文本从右侧滑入而不是从顶部滑动。另外，有没有另一种方法可以让它自动滑动并在完成后继续循环？

这是 HTML：

 <div class="slides">
    <div>test 1</div>
    <div>test 2</div>
    <div>test 3</div>
    <div>test 4</div>
    <div>test 5</div>
    <div>test 6</div>
  </div>
  <ul class="btns">
    <li class="one"><a href="#">test</a></li>
    <li class="two"><a href="#">test 2</a></li>
    <li class="three"><a href="#">test 3</a></li>
    <li class="four"><a href="#">test 4</a></li>
    <li class="five"><a href="#">test 5</a></li>
    <li class="six"><a href="#">test 6</a></li>
  </ul>

这是Jquery：

var $btns = $('.btns a'), $slides = $('.slides > div');
$btns.click(function(){
  $(this).addClass('current')
  $(this).parent().siblings().find('a').removeClass('current');
  $slides.eq($btns.index(this)).slideDown().siblings().slideUp();
  return false;
});
$btns.first().click();

这里还有一个指向jsfiddle的链接：http://jsfiddle.net/1c82yyt7/

这样的东西？

法典 

var $btns = $('.btns a'), $slides = $('.slides > div');
$btns.click(function(){
    $(this).addClass('current')
    $(this).parent().siblings().find('a').removeClass('current');
    $slides.eq($btns.index(this)).animate({"width":"toggle"},1000).siblings().hide();
    return false;
});
$btns.first().trigger('click');
相关文章：