无法使用资产管道在RoR中实现滑块

时间:2013-06-28 18:18:53

标签: javascript html ruby-on-rails ruby-on-rails-3.1

我无法使用资产管道链接css和javascript文件。我是新手,所以在我犯很轻微错误的地方帮助我。我基本上创建了一个非常基本的静态页面,我试图在页面上添加一个滑块。滑块来自http://www.basic-slider.com/。 这是home.html.erb中的代码     <h1>StaticPages#home</h1> <p>Find me in app/views/static_pages/home.html.erb</p> <div id="container"> <h2>Fade Example</h2>

  <!--  Outer wrapper for presentation only, this can be anything you like -->
  <div id="banner-fade">

    <!-- start Basic Jquery Slider -->
    <ul class="bjqs">
      <li><img src="banner01.jpg" title="Automatically generated caption"></li>
      <li><img src="banner02.jpg" title="Automatically generated caption"></li>
      <li><img src="banner03.jpg" title="Automatically generated caption"></li>
    </ul>
    <!-- end Basic jQuery Slider -->

  </div>
  <!-- End outer wrapper -->

  <script class="secret-source">
    jQuery(document).ready(function($) {

      $('#banner-fade').bjqs({
        height      : 320,
        width       : 620,
        responsive  : true
      });

    });
  </script>`

我已经复制了滑块在assets / javascript和assets / stylesheets中工作所需的基本文件

1 个答案:

答案 0 :(得分:0)

我假设您的图片位于app/assets/images/目录中。您的图片来源需要更新,以在路径中包含assets/。如果你使用了image_tag('banner01.jpg'),这将由rails来照顾你。

<!--  Outer wrapper for presentation only, this can be anything you like -->
  <div id="banner-fade">

    <!-- start Basic Jquery Slider -->
    <ul class="bjqs">
      <li><img src="assets/banner01.jpg" title="Automatically generated caption"></li>
      <li><img src="assets/banner02.jpg" title="Automatically generated caption"></li>
      <li><img src="assets/banner03.jpg" title="Automatically generated caption"></li>
    </ul>
    <!-- end Basic jQuery Slider -->

  </div>
  <!-- End outer wrapper -->

  <script class="secret-source">
      jQuery(document).ready(function($) {

      $('#banner-fade').bjqs({
        height      : 320,
        width       : 620,
        responsive  : true
      });

    });
  </script>