Referenzieren von Bildern in Ruby on Rails

Ich habe ein Skript auf einer Seite (unten), die ein jQuery Plugin aufruft und den Pfad zu einer Anzahl von Bildern übergibt. Die Bilder werden in app/assets/img/bg im Gegensatz zu app/assets/images gespeichert.Referenzieren von Bildern in Ruby on Rails

<script> 
    $(".forms-wrapper").backstretch([ 
     "assets/img/bg/6.jpg", 
     "assets/img/bg/5.jpg", 
     "assets/img/bg/7.jpg", 
     ], { 
      fade: 1000, 
      duration: 7000 
     }); 
</script>

Die JavaScript Funktion ist in einer Datei, die sich in app/assets/plugins/Gerade.

Ich kann die Funktionalität arbeiten erhalten, indem Sie den Pfad zu den Bildern zu ändern und Bewegen der Bilder: -

<script> 
    $(".forms-wrapper").backstretch([ 
     "../assets/7.jpg", 
     "../assets/16.jpg", 
     "../assets/19.jpg", 
     ], { 
      fade: 1000, 
      duration: 7000 
     }); 
</script>

Ich würde lieber nicht die Bilder bewegen, wie sie von vielen verschiedenen Orten referenziert werden. Ich habe versucht, den Pfad im Skript zu ./assets/img/bg/7.jpg ändern und das funktioniert nicht.

Ich habe anscheinend alle möglichen Probleme mit relativen Pfaden in Schienen, weil es scheint, seine eigenen Regeln anzuwenden.

Als ein anderes Beispiel gibt es ein Skript, das Thema Farben und Bilder ändert, aber dieses Skript verweist auf den Ordner img auch. Ich müsste hier auf den Bilderordner mit einem relativen Pfad verweisen (../assets/img) aber relative Pfade scheinen sich nicht ordnungsgemäß zu verhalten.

var setColor = function (color, data_header) { 
    jQuery('#style_color').attr("href", "assets/css/theme-colors/" + color + ".css"); 
    if(data_header == 'light'){ 
     jQuery('.logo img').attr("src", "assets/img/themes/logo1-" + color + ".png"); 
     jQuery('#logo-footer').attr("src", "assets/img/themes/logo2-" + color + ".png"); 
     jQuery('.navbar-brand img').attr("src", "assets/img/themes/logo1-" + color + ".png"); 
    } else if(data_header == 'dark'){ 
     jQuery('.logo img').attr("src", "assets/img/themes/logo1-" + color + ".png"); 
     jQuery('#logo-footer').attr("src", "assets/img/themes/logo2-" + color + ".png"); 
    } 
}

Wie kann ich ein Unterverzeichnis von Assets zuverlässig an Referenzbilder adressieren? Dieses Problem manifestiert sich in verschiedenen Teilen der Anwendung auf unterschiedliche Weise.

Danke

Quelle

2017-06-05 Dunny

Ca n frage ich warum so einen Pfad für den 'img'-Ordner? –

Ja - es ist, weil es Teil einer Site ist, die ich importiert habe, und es gibt viele Assets (Bilder, js, CSS-Dateien usw.) in Unterordnern. Ich habe ursprünglich versucht, die Assets in die Standard-Ordner innerhalb meiner Ruby-App, aber es gibt alle Arten von Datei-Referenzen, die dann brechen – Dunny

Sie müssen die Vermögenswerte Helfer in Rails verwenden

$(".forms-wrapper").backstretch([ 
    "<%= image_path('bg/6.jpg') %>", 
    "<%= image_path('bg/7.jpg') %>", 
    "<%= image_path('bg/8.jpg') %>", 
    ], { 
     fade: 1000, 
     duration: 7000 
    });

Dies setzt voraus, die Bilder in app/assets/images/img/bg Ordner befinden.

Im Allgemeinen Sie in den Weg schicken folgenden app/assets/images, was bedeutet,

image_path('logo.png') # references app/assets/images/logo.png

Edit:

Wenn Sie einen unorthodoxen Ordner verweisen müssen Sie diese zu Ihrem config/initializers/assets.rb hinzufügen können (und Neustart)

Rails.application.config.assets.paths << Rails.root.join('assets', 'img')

Quelle

2017-06-05 21:35:29 Iceman

@ SebastiánPalma - das hat funktioniert, danke !! Danke Iceman. – Dunny

Großartig, markieren Sie es einfach als akzeptiert, um die Frage zu schließen. – Iceman

@Iceman Will ... nur eine letzte Frage, wenn ich kann ..... wie kann ich die gleiche Funktionalität auf den Pfad in der JavaScript-Funktion anwenden? Ich schätze die Hilfe, die Sie gegeben haben, also wenn Sie keine Zeit haben, diesen Teil anzugehen, werde ich nur schließen und mehr Nachforschungen anstellen. Dies ist bei weitem der schwierigste Teil von Schienen, die ich gestoßen bin !! – Dunny

Bitte versuchen Sie es.

<script> 
    $(".forms-wrapper").backstretch([ 
    "../assets/img/bg/6.jpg", 
    "../assets/img/bg/5.jpg", 
    "../assets/img/bg/7.jpg", 
    ], { 
     fade: 1000, 
     duration: 7000 
    }); 
</script>

Quelle

2017-06-05 19:21:11

Hallo. Ich habe das versucht, aber das funktioniert auch nicht. Der Pfad, der in der Konsole angezeigt wird, ist http://127.0.0.1:3000/assets/img/bg/6.jpg, aber das Bild wird nicht angezeigt. – Dunny

Ich denke, ich bekomme den Pfad korrekt, aber Rails wirft einen Routenfehler (No route matches [GET] "/assets/img/themes/logo2-orange.png). Referenzieren von Dateien und Ordnern in Schienen scheint wie ab, Mangel an Kunst ! – Dunny

Referenzieren von Bildern in Ruby on Rails

Antwort

Verwandte Themen