TAMSHOTS
-
Posts
4 -
Joined
-
Last visited
Content Type
Forums
Downloads
Store
Events
Blogs
Gallery
Profiles
Everything posted by TAMSHOTS
-
dropdown Site navigation dropdown menu issue (mobile view)
TAMSHOTS replied to TAMSHOTS's topic in Site Structure & Navigation
you're amazing, thank you so much!!- 2 replies
-
- 1
-
-
- accessibility
- mobile
- (and 1 more)
-
Hi all whom read this! Currently am running into this issue for a long time regarding my dropdown menus: My website www.capturedwithpassion.com exists out of an English and Dutch version (using duplicate pages), where on desktop everything works all fine. However, on mobile/tablet view it does not show the pages in the drop down menu at the Dutch version (as shown in the video recording). It might be a custom code issue, as it's only the dropdown menu part on mobile view in particular... my brain can't see where the issue is though, hope someone can help out! One of the pages custom code that won't show: <style> #header .header-nav-item:nth-child(1){ display:none } #header .header-nav-item:nth-child(2){ display:none } #header .header-nav-item:nth-child(3){ display:none } #header .header-nav-item:nth-child(4){ display:none } #header .header-nav-item:nth-child(5){ display:none } #header .header-nav-item:nth-child(6){ display:none } #header .header-nav-item:nth-child(7){ display:none } </style> <style> @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(1){ display:none } @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(2){ display:none } @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(3){ display:none } @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(4){ display:none } @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(5){ display:none } @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(6){ display:none } @media screen and (max-width:1511px){ #header .header-menu-nav-item:nth-child(7){ display:none } </style> RPReplay_Final1706443875.MP4
-
Hi Tuan, I need your help 🙂
I have been using some code to create duplicated pages without showing the opposite language pages, depending on which language my visitors prefer.Â
It worked perfectly fine, however on mobile view I have been facing an issue, where the drop down menu at "details" draws a complete blank. It is not due to the link color that is by accident on white, no. And I cannot find any issue in the code I am using (this specific one is for the Dutch homepage) as there is no issue with accessing the English drop-down menu version: and the code is just the opposite of both:
There are no issues when accessing the drop down menu from a desktop. Hope you're able to help figure out what is wrong. I provided you with screenshots from my phone and also an email from a SQ expert who emailed me back. Thank you in advance!Â
<style>
 #header .header-nav-item:nth-child(1){
  display:none
 }
 #header .header-nav-item:nth-child(2){
  display:none
 }
 #header .header-nav-item:nth-child(3){
  display:none
 }
 #header .header-nav-item:nth-child(4){
  display:none
 }
 #header .header-nav-item:nth-child(5){
  display:none
 }
 #header .header-nav-item:nth-child(6){
  display:none
 }
 #header .header-nav-item:nth-child(7){
  display:none
 }
 #header .header-nav-item:nth-child(8){
  display:none
 }
</style><style>
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(1){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(2){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(3){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(4){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(5){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(6){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(7){
    display:none
   }
   @media screen and (max-width:1511px){
   #header .header-menu-nav-item:nth-child(8){
    display:none
   }
</style>Â
