Menu Click problem

Hi Nicola,

Thanks for letting me know about this.

I have checked your site both on my phone, tablet and laptop and it is working fine for me.

When I click on “Cerco” or “Offro” it opens the correct paeg as expected. The following URLs get loaded:

https://petsitterwp.cirotto.net/annunci-categorie/cerco/
https://petsitterwp.cirotto.net/annunci-categorie/offro/

Please could you let me know exactly what the issue is as I am unable to find any.

Many thanks

Peter

Yes, sorry for my english..

When I click Responsive menu Cerco or Offro the link not load but it show the combo box selection under the overlay menu.

I try to post images to explain it:

Clicking on Offro you can see the double focus on Offro and the combobox under menu
https://petsitterwp.cirotto.net/problem_01.png

and it not open the link of Offro but open the combobox selection:
https://petsitterwp.cirotto.net/problem_01.png

Strange problem… On another phone, I don’t have this problem.

Thanks

Hi Nicola,

Thanks for the screenshots, I understand your issue now.

Unfortunately I have been unable to replicate this issue across any of my devices and as such its quite hard to debug.

Could you please let me know which browsers and versions or devices that you are having issues on.

Many thanks

Peter

Yes without replicate of issue, it’s impossible to solve the problem.
My device is: HTC EVO 3D with Android 4.0.3 and Standard Browser I think Mobile Safari 534.30 (this is whatmyuseragent.com result)

Maybe I can debug it next days, but now I’m working around all site and the last work is to try to resolve the problem.

If I will find the problem, I will write here.

Thanks

Hi NicolaCirotto,

Sorry I can’t be of more help with this, unfortunately I don’t have access to every device in the world and there are so many out there with slightly different settings and ways of representing the data.

I would suggest looking at something called the z-index which is a CSS rule that determines which elements appear above others but without being able to replicate the issue here I can’t test out this theory unfortunately.

Try setting z-index: 0; to your CSS files for the select boxes and everything related to them and see if this helps.

Many thanks

Peter

yes yes I know… I work with mobile app from years and every mobile have is history ??

I tried with z-index and other css possibilities but NOT work.

I had a idea… I created this script to see if it work and is ok (without animation is test code).
In the footer script I have added a code to have similar effect of https://demo.tempees.com/mobile-app-menu/

$('#click-menu').click(function() {
		width = $('#responsive-menu').width();
		if (isOpen)
		{
			$('.container').css('margin-left', (width + 'px'));
			return;
		}
		$('.container').css('margin-left', '0px');
		return;
	});

But is not a better solution… the best is you can add this option in your plugin…

there are a problem only with a close button if I use my solution.. but is not a problem I customise and I include the X button inside your menu by code.

I only want to tell this if you choose to add the option of “move the content page” you need to insert a X button inside menu.

ok, finally my code:

CSS:

#myCloseButton
{
	float: right!important;
	font-size: 1.5em;
	font-weight: bold;
	width: 30px!important;
	height: 30px!important;
	text-align: center!important;
	padding-top: 10px;
	color: white;
	cursor: pointer;
}

And javascript code:

jQuery(document).ready(function($)
{
	jQuery('#responsive-menu').prepend('<div id="myCloseButton">X</div>');
	jQuery('#myCloseButton').click(function() {
		jQuery('#click-menu').click();
		return
	});
	jQuery('#click-menu').click(function() {
		width = jQuery('#responsive-menu').width();
		var options = {};
		jQuery('#click-menu').hide();
		if (isOpen)
		{
			options['margin-left'] = width;
			jQuery('.container').stop().animate(
				options, 500, 'linear', function() {
			});
			return;
		}
		options['margin-left'] = 0;
		jQuery('.container').stop().animate(
				options, 500, 'linear', function() {
				jQuery('#click-menu').show();
			});
		return;
	});
}

Hi Nicola,

Looks like you have been busy!

Have you got it working as you wish now?

I will look at potentially implementing some of this in the new version but as yet no promises.

One thing I will ask is. Have you made it upgrade proof? As I don’t want all your hard work to be lost when you upgrade to the 1.10 version.

Many thanks

Peter

Hi Nicola,

I’ve just looked again at your site and it seems what you are using is the “Push” animation option, which is already an option inside the plug-in admin to use.

You need to specify the CSS container that you want to push with the animation but it works well.

Have you tried using this native option to the plug-in yet?

Many thanks

Peter

Hi Peter,
is true… the plugin already have this feature ahahah
Sorry!!
I changed to “PUSH” on slide animation and “.container” for page wrapper.
It work perfectly.

It don’t have only the close (X) button inside the responsive menu. I need it and I changed my code to:

jQuery(document).ready(function($)
{
	jQuery('#responsive-menu').prepend('<div id="myCloseButton">X</div>');
	jQuery('#myCloseButton').click(function() {
		jQuery('#click-menu').click();
		return
	});
	jQuery('#click-menu').click(function() {
		if (isOpen)
		{
			jQuery('#click-menu').hide();
			return;
		}
		jQuery('#click-menu').show();
		return;
	});
}

My code is inside my template on footer using wp_enqueue_script.
With future upgrade I don’t will have problems because my code are not in plugin file.

Thanks for your support!

Hi Nicola,

Great news that you got it all working for you and that it is protected from upgrade!

I hope you enjoy using the plug-in and any future version!

Many thanks

Peter