javascript - How to make "navbar-fixed-bottom" slide up when button is clicked in responsive mode? (bootstrap) -



javascript - How to make "navbar-fixed-bottom" slide up when button is clicked in responsive mode? (bootstrap) -

currently twitter bootstrap's navbar @ bottom (used footer) slides "down" when button pushed on phone screen or narrow window.

i want menu slide "up" instead of default "down".. ideas on how can twitter bootstrap?

the code used in view layer of navbar footer follows:

<footer id="footer" class="navbar navbar-fixed-bottom"> <div class="navbar-inner"> <div class="container"> <button type="button" class="btn btn-navbar dropup" data-toggle="collapse" data-target=".show-footer"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div class="nav-collapse collapse show-footer"> <nav> <ul class="nav pull-right"> <%= g_about_link(yield(:title)) %> <%= g_contact_link(yield(:title)) %> <%= g_faq_link(yield(:title)) %> <%= g_careers_link(yield(:title)) %> <%= g_privacy_link(yield(:title)) %> <%= g_quotes_link(yield(:title)) %> <%= g_terms_link(yield(:title)) %> <li><a href="http://news.railstutorial.org/" target="_blank">news</a></li> </ul> </nav> </div><!--/.nav-collapse --> </div> </div> </footer>

scroll bottom of page using show() event callback:

http://jsfiddle.net/apx5n/2/

$(function() { $('.collapse.show-footer').on('show', function () { $("html, body").animate({ scrolltop: $(document).height() }, "slow"); }); }); <div class="container"> ... <div class="nav-collapse show-footer collapse"> ... </div> </div>

javascript html css twitter-bootstrap

Comments

Popular posts from this blog

web services - java.lang.NoClassDefFoundError: Could not initialize class net.sf.cglib.proxy.Enhancer -

Accessing MATLAB's unicode strings from C -

javascript - mongodb won't find my schema method in nested container -