質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

1回答

3519閲覧

メニューバーのactiveの色が変更できない。

thunder_zak

総合スコア20

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2017/01/27 15:43

開発環境
Ruby 2.2.3
Ruby on Rails 5.0.1
Bootstrap-sass (3.3.7)

参考サイト http://railsgirls.jp/app
上記環境でメニューバーを画面に追加したのですが、選択しているメニューの色が切り替わりません。

イメージ説明
上記画面からメニューバーのideaを押しても、選択のメニューの背景色がグレーになりません。画面は切り替わります。

イメージ説明

こちらのサイトを参考にしました。 http://railsgirls.jp/app
htmlは以下のようにしています。activeはつけているのですが。

application.html.erb

1 <div class="collapse navbar-collapse"> 2 <ul class="nav navbar-nav"> 3 <li class="active"><a href="/users">User</a></li> 4 <li><a href="/ideas">idea</a></li> 5 <li><a href="/pages/info">pages</a></li> 6 </ul> 7 </div>

こういった選択の色が切り替わらない場合、どういった修正をしたらよいのか検討もできずに、どのあたりが怪しいのかあたりをつけることもわからず困っております。
どうか宜しくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

メニューバーであるBootstrapのNavbarを使うには、BootstrapのJavaScriptが必要です。

http://getbootstrap.com/components/#navbar

Requires JavaScript plugin
If JavaScript is disabled and the viewport is narrow enough that the navbar collapses, it will be impossible to expand the navbar and view the content within the .navbar-collapse.
The responsive navbar requires the collapse plugin to be included in your version of Bootstrap.

以下のようにして、Bootstrapのjsファイルをロードしてください。
http://getbootstrap.com/getting-started/

html

1<script src="~~~/bootstrap.min.js" ></script>

投稿2017/01/27 16:59

yuji38kwmt

総合スコア437

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問