TimelineJS: Change height of navigation bar?
css, javascript, jquery, jquery-plugins
Solution
Well, you have to change some css attributes and some JS code: You have to change
timeline.css - .vmm-timeline .navigation (line 151, Change attribute: height) - .vmm-timeline .navigation .timenav .time (line 212, Change top) - .vmm-timeline .navigation .timenav .content .era (line 205, Add attribute max-height) - .vmm-timeline .navigation .timenav-background (line 155,Change height) - .vmm-timeline .navigation .timenav-background .timenav-interval-background (line 155, Change top) - .vmm-timeline .navigation .timenav .content .marker .dot (line 171,Change top)
timeline-min.js Here I just found out a way where you have to hardcode style! Well, there is one value, for example navheight navheight is the height of your .navigation Class MINUS 50 PX In my example its 50!
So there is some code in line 32 where stands
}else{VMM.Lib.stop(w.flag);VMM.Lib.css(w.flag,"top",S)}I.start_page&&a[m].type=="start"&&VMM.Lib.visible(w.marker,!1);
You have to replace the `VMM.Lib.css(w.flag,"top",S)`-part with:
if(S>50){VMM.Lib.css(w.flag,"top","50px")}else{VMM.Lib.css(w.flag,"top",S)}
or (not tested)
if(S>navheight){VMM.Lib.css(w.flag,"top",navheight + "px")}else{VMM.Lib.css(w.flag,"top",S)}
I hope thats it! Err.. and: FireBug helped me alot! ;-)
Problem
Im using the plugin TimelineJS http://timeline.verite.co and Im having a huge amount of difficulty trying to find the div(s) and the css that determine the height of the navigation slider - FireBug and the like just dont help. Just wondering on the off chance has any one achieved this before?