How would I hide (or loads as minimised) map category on Mobile

This topic contains 10 replies, has 2 voices, and was last updated by  adriangraham 9 years, 4 months ago.

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket
  • Author
    Posts
  • November 10, 2014 at 4:43 pm #21090

    adriangraham
    Expired Member
    Post count: 426

    Made some changes to the width/colour of the map category on the home page map… (the one with the check boxes to the right of the main homepage map).

    How would I hide (or loads as minimised) map category on Mobile devices as the changes I made are filling the mobile screen.. searched the css but can’t see mobile layer for this.

    Thanks a mil!

    Adrian

    November 10, 2014 at 4:47 pm #21092

    Simone
    Expired Member
    Post count: 3515

    Hello Adrian, try adding the following code in your child theme’s css

    

    @media only screen and (max-width:480px)
div#sticky_map_geodir_map_v3_home_map_3.top_banner_section.geodir_map_container {
display:none;
}
    

		
	
    


    

			
				

    

	
    

		November 10, 2014 at 4:51 pm

		
		#21093

		
		
		
	
    


    


    

	
    

		
		
    adriangraham
    Expired Member
    
		
		
     Post count: 426
    
	
    

	
    

		
		
    Hi Simone,
    

    Thanks for the fast reply. That didn’t work unfortunately…. you can drag your browser down to size and have a look… thanks a lot.
    

    http://www.childcarefinder.ie
    

    Adrian
    

		
	
    


    

			
				

    

	
    

		November 10, 2014 at 5:23 pm

		
		#21102

		
		
		
	
    


    


    

	
    

		
		
    Simone
    Expired Member
    
		
		
     Post count: 3515
    
	
    

	
    

		
		
    This code will work (tested on my site)
    

    

    @media  screen and (max-width: 1040px)
{
.stick_trigger_container .geodir_map_container, .stick_trigger_container .geodir_map_container .map_background .main_map_wrapper, .stick_trigger_container .geodir_map_container .map_background .main_map_wrapper .geodir_marker_cluster, .stick_trigger_container .geodir_map_container .map_background .main_map_wrapper .loading_div
{
	display: none !important;
}
}
    

		
	
    


    

			
				

    

	
    

		November 11, 2014 at 9:25 am

		
		#21134

		
		
		
	
    


    


    

	
    

		
		
    adriangraham
    Expired Member
    
		
		
     Post count: 426
    
	
    

	
    

		
		
    Simone,
    

    That worked… almost.. but I like it! On mobile it’s hiding the full map on the homepage… which actually works well for me… so thanks for that
    

    Adrian
    

		
	
    


    

			
				

    

	
    

		November 11, 2014 at 12:23 pm

		
		#21152

		
		
		
	
    


    


    

	
    

		
		
    Simone
    Expired Member
    
		
		
     Post count: 3515
    
	
    

	
    

		
		
    Thanks, I’m glad you like it.
    

    S.
    

		
	
    


    

			
				

    

	
    

		December 31, 2014 at 3:32 pm

		
		#25949

		
		
		
	
    


    


    

	
    

		
		
    adriangraham
    Expired Member
    
		
		
     Post count: 426
    
	
    

	
    

		
		
    Hi Simone,
    

    Opening this post again as when testing I notice that the map on the homepage is hidden on mobile…. as requested…. however the map on the “detail” page “map” tab is too.
    

    Is there any way of differentiating this so that the map is shown on the detail page “map” tab?
    

    Thanks a million,
    

    A 
    

		
	
    


    

			
				

    

	
    

		December 31, 2014 at 3:47 pm

		
		#25951

		
		
		
	
    


    


    

	
    

		
		
    adriangraham
    Expired Member
    
		
		
     Post count: 426
    
	
    

	
    

		
		
    One way around this could be to load the map on mobile and regular screens as per the default plugin settings…. but to minimise the map “legend” on the homepage on mobiles.. as it’s this map category listing legend that is causing me the layout issues anyway??
    

		
	
    


    

			
				

    

	
    

		December 31, 2014 at 8:23 pm

		
		#25967

		
		
		
	
    


    


    

	
    

		
		
    Simone
    Expired Member
    
		
		
     Post count: 3515
    
	
    

	
    

		
		
    Hello, we can help to customise with minor css tweaks
    
 If you want I can move this into the jobs section of the forum where if you wish, we can provide a quote to finish customizing your website look and feel
    

		
	
    


    

			
				

    

	
    

		January 2, 2015 at 11:00 am

		
		#26042

		
		
		
	
    


    


    

	
    

		
		
    adriangraham
    Expired Member
    
		
		
     Post count: 426
    
	
    

	
    

		
		
    Paolo,
    

    Don’t move to the jobs section yet…. as all I really want is to on mobile phones load the homepage map with the sidebar/legend hidden so I will try that in CSS.
    

    Thanks….as always
    

    A
    

		
	
    


    

			
				

    

	
    

		January 2, 2015 at 11:08 am

		
		#26043

		
		
		
	
    


    


    

	
    

		
		
    adriangraham
    Expired Member
    
		
		
     Post count: 426
    
	
    

	
    

		
		
    @media  screen and (max-width: 500px)
    
{
    
.map_category, .fa-compress
    
{
    
	display: none !important;
    
}
    

    seems to do it on mobiles….for anyone else wondering
    

		
	
    


    

			
		
	
    • 

	
  • 

		
    Author
    

		
    

			
				Posts
			
		
    

	
    • 





			



	


		Viewing 11 posts - 1 through 11 (of 11 total)
	


	


		
	





		
				

			

				

					
We have moved to a support ticketing system and our forums are now closed.

					Open Support Ticket