Rails：如何使用 javascript 滑块显示 ActiveRecord 对象？答案

【问题标题】：Rails: How to use a javascript slider to display ActiveRecord Objects?Rails：如何使用 javascript 滑块显示 ActiveRecord 对象？
【发布时间】：2013-10-06 04:00:22
【问题描述】：

在我的主页上，我想随机显示 30 个用户。但我想使用滑块显示它们。所以一次只显示 1 个用户，并且有滑块可以转到下一个用户。在我的主页控制器中，我有：

@random_users = User.random(30)

我想在div 中显示用户照片和他个人资料中的其他信息

height:400px;
width:200px;

我只是不确定如何为活动记录对象实现滑块功能。有没有我可以使用的 gem 或插件？

【问题讨论】：

标签： javascript jquery ruby-on-rails ruby-on-rails-3

【解决方案1】：

我对滑块的常规选择之一是 bxslider：http://bxslider.com/。

有一个 rails gem bxslider-rails 可以为您完成所有设置：https://github.com/manfe/bxslider-rails

然后你可以这样做：

查看：

<div class="slider-wrapper">
  <ul class="bxslider">
    <% @random_users.each do |user| %>
      <li>
        <%= image_tag user.image %>
        <%= user.name %>
      </li>
    <% end %>
  </ul>
</div>

Javascript：

$('.bxslider').bxSlider({mode: 'fade', auto: true});

CSS：

.slider-wrapper { 
  height:400px;
  width:200px;
}

【讨论】：

【解决方案2】：

没有 gem，但如果你使用 jquery，那么你可以使用 jCarousel 和 Cycle 等 jQuery 插件。

【讨论】：

是的，我发现了很多插件，比如ramblinglabs.com/slider-rails。它们都是为了图像。我只是不确定如何遍历 @random_users 并显示它们而不是图像。
所以你可以放置任何你想要的html元素来代替标签。