Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 20, 2014 at 11:08 pm #338729
    shenom

    Hello,

    I have customized the mobile Menu of enfold to show the header area. Result is live here:
    cop-morrien.de

    Due to client request I added a search icon to the mobile-header. The search Icon links to the search-field
    in the sidebar (under the main-content in mobile view). Everything works fine so far. The only thing, that I can not manage to get to work is the following case:
    When the menu is open and the user clicks the search icon in the header (next to the mobile menu toggle icon) I want the menu to hide and the page to scroll to the search field. The scroll does work, but I can not get the menu to hide at the same time.

    This is my code in js > avia.js (which I have copied to my child theme):

    $html.on('click', '#add-search-icon', function()
	{
	container.removeClass('show_mobile_menu');
	container.css({'height':"auto"});
});

    But this sadly doesn’t work. I also tried:
    $(#add-search-icon).click(hide_menu);

    Can you please check what is wrong.

    Thanks

    • This topic was modified 9 years, 6 months ago by shenom.
    October 21, 2014 at 8:13 am #338862
    Ismael

    Hi shenom!

    Thank you for using Enfold.

    Please try this on functions.php:

    function add_search_icon(){
?>
<script>
jQuery(window).load(function(){
	var container = jQuery('#wrap_all');	
		jQuery('#add-search-icon').click(function() {
			container.removeClass('show_mobile_menu');	
			container.css({'height':'auto'});
		});	
	});
</script>
<?php
}
add_action('wp_footer', 'add_search_icon', 10);

    Best regards,
    Ismael

    October 21, 2014 at 12:18 pm #338966
    shenom

    Hello Ismael,

    thank you for the code. It works on all pages except on the frontpage. There, when the search icon is clicked, nothing happens and the page becomes unresponsive. That is: the menu stays open, but the menu items and the menu toggle icon can not be clicked.

    And I wonder, why your code in the functions.php works, while my changes in the avia.js does not? It is more or less the same code.

    • This reply was modified 9 years, 6 months ago by shenom.
    October 27, 2014 at 1:36 pm #341461
    Yigit

    Hey!

    Seems like you found a workaround simply by linking the button to search box. Let us know if you have any other questions or issues!

    Regards,
    Yigit

    October 27, 2014 at 4:30 pm #341578
    shenom

    Thanks Yigit,

    I would love to have my other question answered (I’m waiting for a couple of days now). Here is the thread:
    http://goo.gl/WJX6fp

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Mobile Menu Search Function’ is closed to new replies.