Reply To: Full screen search bar on mobile

Hi Fabrizio,

Thank you very much for your kind words!

Well, I am not sure if this is possible without major modifications – but there are a few tricks you can try.
I would start by creating a javascript event handler, when the plugin input is focused, then the plugin container is changed to a “fixed” position, with a 0 top, left and right value. Then another event handler would handle when the input looses the focus, something like this:

jQuery(function($){
	$('.asp_m input.orig').on('focus', function(){
		$(this).closest('.asp_m').css({
			'position': 'fixed',
			'top': 0,
			'left': 0,
			'right': 0
		});
	});
	$('.asp_m input.orig').on('blur', function(){
		$(this).closest('.asp_m').css({
			'position': 'static'
		});
	});
});

This will move the search to the top on focus, and move it back on blur. It should be a good start, but still you will have to include a detection for mobile devices, and make some adjustmends of course.