将定期JavaScript实现与红宝石在JavaScript实现

我在一个普通的index.html将定期JavaScript实现与红宝石在JavaScript实现

<!DOCTYPE html> 
<html lang="en"> 
    <head> 

    <title>Template</title> 

    <!-- Bootstrap core CSS --> 
    <link href="assets/css/bootstrap.css" rel="stylesheet"> 
    <!--external css--> 
    <link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" /> 

    <!-- Custom styles for this template --> 
    <link href="assets/css/style.css" rel="stylesheet"> 
    <link href="assets/css/style-responsive.css" rel="stylesheet"> 
    </head> 

    <body> 

    <!-- A BUNCH OF OTHER CODE..... --> 

    <!-- THIS IS WHAT I WANT ! --> 

    <!-- js placed at the end of the document so the pages load faster --> 
    <script src="assets/js/jquery.js"></script> 
    <script src="assets/js/bootstrap.min.js"></script> 

    <!--BACKSTRETCH--> 
    <!-- You can use an image of whatever size. This script will stretch to fit in any screen size.--> 
    <script type="text/javascript" src="assets/js/jquery.backstretch.min.js"></script> 
    <script> 
     $.backstretch("assets/img/solar.jpg", {speed: 500}); 
    </script> 

    <!-- END OF WHAT I WANT --> 


    </body> 
</html>

下面的代码在index.html的结束，我想包括jQuery的轨道javascript和jQuery的-backstretch.min文件放入我的Rails应用程序中。有没有一个标准的轨道做这个？

我试图注入到下列new.html.erb

<!-- js placed at the end of the document so the pages load faster --> 
<%= javascript_include_tag '../assets/javascripts/jquery.js', 'data-turbolinks-track' => true %> 

<!--BACKSTRETCH--> 
<!-- You can use an image of whatever size. This script will stretch to fit in any screen size.--> 
<%= javascript_include_tag '../assets/javascripts/jquery.backstretch.min.js"', 'data-turbolinks-track' => true %> 

<script> 
    $.backstretch("assets/images/solar.jpg", {speed: 500}); 
</script>

和

<!-- js placed at the end of the document so the pages load faster --> 
<script src="assets/javascripts/jquery.js"></script> 

<!--BACKSTRETCH--> 
<!-- You can use an image of whatever size. This script will stretch to fit in any screen size.--> 
<script type="text/javascript" src="assets/javascripts/jquery.backstretch.min.js"></script> 
<script> 
    $.backstretch("assets/images/solar.jpg", {speed: 500}); 
</script>

但不幸的是他们两人似乎是一个错误的轨道。

我该怎么办？

编辑：

我已经添加了修改过的文件到我的application.js所以现在它看起来像这样

//= require jquery 
//= require jquery_ujs 
//= require jquery.backstretch.min 
//= require turbolinks 
//= require_tree .

，我已经从那以后从new.html删除相应的脚本标签.erb。现在，在底部，它仅包含脚本调用

<script> 
    $.backstretch("assets/images/solar.jpg", {speed: 500}); 
</script>

但不幸的是仍然不正确

来源

2014-10-31 user3277633

jQuery是否设置在底部？也许问题来自'backstrectch'脚本。 – Vadorequest 2014-10-31 19:20:54

嗯我不确定你的意思。我应该将jquery移动到顶端吗？ – user3277633 2014-11-01 03:18:06

当您调用'$ .backstretch'时，是否设置了$ $？ – Vadorequest 2014-11-01 10:16:37

我有，你可能可以使用的解决方案。 backstretch插件的javascript正在使用这种方法。我目前在一个页面上使用它，因为如果您将方法的require语句和javascript添加到application.js文件，Backstretch将在所有页面上触发。

步骤＃1的一个安装宝石直道-导轨步骤＃2将// =需要直道步骤＃3添加<%= javascript_include_tag "jquery.backstretch" %>

<%= javascript_include_tag "backstretch-landing-index" %>

到您index.html.erb视图。 body标签的顶部

第4步添加

Rails.application.config.assets.precompile += %w(jquery.backstretch.js) 
Rails.application.config.assets.precompile += %w(backstretch-landing-index.js)

到您的初始化/ assets.rb文件

里面的直道进登陆index.js的添加要调用的函数

$.backstretch([ 
     "http://dl.dropbox.com/u/515046/www/outside.jpg" 
    , "http://dl.dropbox.com/u/515046/www/garfield-interior.jpg" 
    , "http://dl.dropbox.com/u/515046/www/cheers.jpg" 
], {duration: 3000, fade: 750});

它的工作原理！与图像的完整路径链接。 "/assets/photo1.png"对我来说

来源

2015-01-02 07:19:32 user3646743

将定期JavaScript实现与红宝石在JavaScript实现

回答

相关问题