// toolbar is now better than ever \!

This commit is contained in:
mMarinetti
2011-11-14 10:19:06 +00:00
parent 9370253d88
commit 177938b784
2 changed files with 16 additions and 12 deletions
+1 -1
View File
@@ -140,7 +140,7 @@ a.module_toggle_all{color: #268CCD;}
.table td span.color_field { font-size:11px; padding:2px 5px; border-radius:3px; text-transform:uppercase; text-shadow:0 1px 0 #fff; color:#fff; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
/*toolbarBox*/
.toolbarBox { background-color: #F8F8F8; border: 1px solid #CCCCCC; margin-bottom:10px; padding: 10px 0; width:100% !important; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
.toolbarBox { background-color: #F8F8F8; border: 1px solid #CCCCCC; margin-bottom:10px; padding: 10px 0; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
.toolbarBox .pageTitle { margin-left:10px; line-height:48px}
.toolbarBox .pageTitle h3 {font-size: 2em; font-weight: bold; line-height: 48px; margin: 0; padding: 0;}
.toolbarBox ul.cc_button {float:right;margin:0;padding:0;}
+15 -11
View File
@@ -54,37 +54,41 @@
</script>
{/if}
<script type="text/javascript">
<script type="text/javascript">
$(document).ready(function(){
var message = $('.toolbarHead');
var view = $(window);
// bind only if message exists. placeholder will be its parent
view.bind("scroll resize", function(e)
{
message.each(function(el){
// bind only if message exists. placeholder will be its parent
view.bind("scroll resize", function(e)
{
message.each(function(el){
if (message.length)
{
placeholder = $(this).parent();
if(e.type == 'resize')
$(this).css('width', $(this).width());
$(this).css('width', $(this).parent().width());
placeholderTop = placeholder.offset().top;
var viewTop = view.scrollTop() + 15;
if ((viewTop > placeholderTop) && !$(this).hasClass("fix-toolbar"))
// here we force the toolbar to be "not fixed" when
// the height of the window is really small (toolbar hiding the page is not cool)
window_is_more_than_twice_the_toolbar = view.height() > message.parent().height() * 2;
if (!$(this).hasClass("fix-toolbar") && (window_is_more_than_twice_the_toolbar && (viewTop > placeholderTop)))
{
$(this).css('width', $(this).width());
// fixing parent height will prevent that annoying "pagequake" thing
// the order is important : this has to be set before adding class fix-toolbar
$(this).parent().css('height', $(this).parent().height());
$(this).addClass("fix-toolbar");
}
else if ( (viewTop <= placeholderTop) && $(this).hasClass("fix-toolbar"))
else if ($(this).hasClass("fix-toolbar") && (!window_is_more_than_twice_the_toolbar || (viewTop <= placeholderTop)) )
{
$(this).removeClass("fix-toolbar");
}
}
});
});
}); // end bind
});
</script>