0.0
No commit activity in last 3 years
No release in over 3 years
Slim out certain elements of a breadcrumb navigation and show these elements only if the user\'s mouse dwellls on the breadcrumb separator.
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
 Dependencies

Development

>= 0
= 1.0.1
>= 1.5.0
>= 0
= 2.10.0

Runtime

 Project Readme

SlimBreadcrumb Build Status

This is a ruby on rails gem to slim out certain elements of a breadcrumb navigation and show these elements only if the user's mouse dwells on the breadcrumb separator.

Clicking on a separator also shows the hidden elements near the mouse. Doubleclick anywhere in the breadcrumb area will show all hidden breadcrumb elements.

Demo

You might want to have a look at this demo app at heroku.

The code of this demo app can be found here.

Installation

Add this line to your application's Gemfile:

gem 'slim_breadcrumb'

And then execute:

$ bundle

Or install it yourself as:

$ gem install slim_breadcrumb

Include Assets

In app/assets/javascripts/application.js, add:

//= require slim_breadcrumb

Usage

In order to use this gem, you may use any tool of convenience to create your breadcrumb html code. The produced html code should look something like this:

<nav>
  <div id="breadcrumb">
    <ul>
	  <li class="first crumb"><a href="#">#0 (Root)</a></li>
	  <li class="crumb sep">&nbsp;</li>
			  
	  <li class="slim crumb"><a href="#">#1 (Slim Crumb)</a></li>
	  <li class="crumb sep">&nbsp;</li>
				  
	  <li class="slim crumb"><a href="#">#2 (Slim Crumb)</a></li>
	  <li class="crumb sep">&nbsp;</li>
							  
	  <li class="crumb"><a href="#">#3 (Normal Crumb)</a></li>
	  <li class="crumb sep">&nbsp;</li>
									  
	  <li class="slim crumb"><a href="#">#4 (Slim Crumb)</a></li>
	  <li class="crumb sep">&nbsp;</li>
													  
	  <li class="slim last crumb"><a href="#">#5 (Slim Crumb)</a></li>
    </ul>
  </div>
</nav>

The important parts of this example are the css classes and the id #breadcrumb, the script relies on.

If you'd like to have a look at the script, which is rather simple, you can do this here.

You also have to handle your stylesheets for the breadcrumb yourself. An example stylesheet can be found here. Note that you may use the breadcrumb separator image just as done in the example, since this gem is providing this image.

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Added some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request