[Chantal Coolsma]

Nobody has a solution?

[Chantal Coolsma]

It is a development site which isn't reachable from outside. This function counts the widgets, but all widgets. Also widgets which aren't shown in the frontend:

function cafe_widget_area_class( $id ) {
	$count = cafe_count_widgets( $id );

	$class = '';

	if( $count == 1 || $count < 9 ) {

		$classes = array(
			'zero',
			'one',
			'two',
			'three',
			'four',
			'five',
			'six',
			'seven',
			'eight',
		);

		$class = $classes[ $count ] . '-widget';
		$class = $count == 1 ? $class : $class . 's';

		return $class;

	} else {

		$class = 'widget-thirds';
		
		return $class;

	}

}

[Chantal Coolsma]

You can solve this using CSS3 and a little jQuery code. I used code below for the navigation area:

jQuery(function( $ ){
	$(window).scroll(function() {
		var yPos = ( $(window).scrollTop() );
		if(yPos > 50) { // show sticky menu after screen has scrolled down 200px from the top
			$(".nav-secondary").css({ 'position': 'fixed', 'top':0, 'left':0, 'z-index':100 });
		} else {
			$(".nav-secondary").css({ 'position': 'relative' });
		}
	});
});

For a nice slide in, you can use the CSS transition property.

[Author]

Posts