Hide column separator on iPhone

The Bikestore demo has the "Template menu". It has 2 columns as explained in the 2 columns article:

https://www.gavick.com/documentation/uncategorized/multiple-menu-columns-plugin

To make this work there must be added an extra menu item, that indicates the column.
There is an option to hide this 'column menu item' in the Link Type: Add Menu Title, which is set as a "Text Separator" and has the Title "Column1"
This works on a computer browser, but it is still visible on the iPhone.
How can I hide this menu item on iPhone?

Appreciated!

Hi

No easy way to do this I'm afraid. Try use a css like this:

Code: Select all

select#mobileMenu option:nth-child(7) {
display: none !important;
}


where number in nth-child() is a number of element counting from top of the options.

Does not work in a Safari browser. Safari is used on the iPhone. It works in Firefox. In Safari you can't assign "display: none" to an <option> element!

Hi

Ok, than try using a script to hide it. Javascript should not have such problems. Add this to the end of /layout/blocks/head.php file

Code: Select all

<script type="text/javascript">(function($) {$(document).ready(function() {
$('select#mobileMenu option:nth-child(7)').remove();
});})(jQuery)</script>