Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'mobile-navigation'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges


Expert ID

Found 9 results

  1. Site URL: https://www.beersmart.io/ Brine family - Mojave -Mobile Nav hamburger clicks through to "menu" and then another list... -Is there a way to have the hamburger click directly to the list itself? Attached are 3 screenshots (combined into a single image) from a mobile device: 1) home page with hamburger, 2) after clicking the hamburger, it creates a "menu" window, 3) after clicking the menu button, it opens the actual list of pages. Is there a way to click the hamburger and display the list of pages?? Thanks!
  2. I am working on a page in 7.1. They wanted a burger-style nav for their desktop site, so I added the below code and successfully achieved this. I would like to know how to best add a background image (custom files)? Alternatively, how to change the background colour and the width of the open navigation (in particular when on desktop). Plenty of thanks in advance! .header-burger { display:flex!important} .header--menu-open .header-menu {opacity: 1!important;visibility: visible!important;} .header-nav, .header-actions {visibility:hidden!important})
  3. Site URL: https://www.magicishappening615.com/ Hi, I am wondering if there is any way to move the placement of the hamburger icon on the mobile display, while using 7.1? Is there any css for this, or am I stuck with it how it is? I have removed the shopping cart for now, and that made it look better, but my client wants the shopping cart back and it doesn’t line up well at all when that happens. Any help is greatly appreciated.
  4. Site URL: https://www.martinfaltejsek.cz Hello, I simply did nothing and today I discovered when viewing my website on a phone/tablet, titles in every single portfolio are so far away from each other. I am not able to fix this via the option "Vertical Link Spacing", it only works for a computer version. Please, does anyone have an idea how to fix this? Here in the attached printscreen is what I mean...Thanks a lot! It has happened out of the blue, so not sure if it's caused by some Squarespace update or what...
  5. Site URL: https://www.michellegonzalezphotos.com/ Implemented a custom mobile navigation menu, and for some reason on mobile screens, a fixed header is appearing OVER the mobile navigation menu. Been racking my brain for hours on what could be causing this issue. Doesn't appear in the mobile screen in the Squarespace backend, but does when testing on actual phone. Which makes it difficult to target the element itself in the Inspect window. Reckon I may need to adjust the z-index of an element? Not sure if I have another element that could be causing the issue, but I've looked at everything and can't seem to figure this out. Any help would be greatly appreciated! Also happy to provide any other info that you feel would be helpful. Code used to implement a fixed header & to change on scroll here: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(window).on("scroll", function() { if($(window).scrollTop() > 400) { $(".Header").addClass("on-scroll"); } else { $(".Header").removeClass("on-scroll"); } }); </script> .Header{ background-color: transparent; width: 100%; position: fixed!important; transition: 0.2s all linear; -webkit-transition:background-color .4s; -moz-transition:background-color .4s; transition:background-color .4s; z-index: 999; } .on-scroll{ background-color: #e6dcd1!important; z-index: 999; } .on-scroll .Header-nav-item{ color: #000!important; } .Header-inner--bottom { padding-bottom: 20px; } .on-scroll .Header-branding-logo { visibility: hidden; } .on-scroll .Header-branding { background-image: url(https://static1.squarespace.com/static/5a47c003c027d80d1f85c73d/t/5e88a47dc8efd76b478354ac/1586013309515/primary-logo-black.png); background-size: contain; background-repeat: no-repeat; background-position: center center; transition: .4s; width: 220px; } Code used for custom mobile navigation menu here: ///Mobile Overlay/// //mobile .Mobile-overlay-nav-item { text-align: center; } .Mobile-overlay-menu { background-image: url(https://static1.squarespace.com/static/5a47c003c027d80d1f85c73d/t/5e91ced3cfe71128e10e1bcb/1586613973454/Venice+Italy+Wedding+Anniversary+Photography+Session-+Destination+Italy+Wedding+Photographer+-+Michelle+Gonzalez+Photography+-109+%281%29.jpg); background-color: #f5deb3; background-position: center; background-repeat: no-repeat; background-size: cover; width: 100vw !important; } .Mobile-overlay-close { z-index: 999; background:transparent !important; } .Mobile-overlay-nav--primary { padding-top:60px; } .mobileLogo { width: 190px; margin-top: -20px; } //mobile branding logo// @media only screen and (max-width: 640px) { .Mobile-bar-branding { -webkit-filter: invert(100%) !important; filter: invert(100%) !important; filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1'); }} //Add this to disable logo on desktop @media screen and (min-width:760px) { .mobileLogo { display:none; } .Header-nav--primary .Header-nav-item:nth-child(1) { display:none !important; } } .Mobile-overlay-nav--secondary .Mobile-overlay-nav-item:first-child { padding-top: 0em !important; } .Mobile-overlay-folder-item { text-align: center !important; padding-top:20px; font-family: 'Danmark Medium';//change as necessary } .Mobile-overlay-folder { padding-top:100px; } .Mobile-overlay-folder-item--toggle-label { font-family: 'Danmark Medium'; } //Add this to disable logo on desktop @media screen and (min-width:760px) { .mobileLogo { display:none; } .Header-nav--primary .Header-nav-item:nth-child(1) { display:none !important; } } .Mobile-overlay-nav--secondary .Mobile-overlay-nav-item:first-child { padding-top: 0em !important; } .Mobile-overlay-folder-item { text-align: center !important; padding-top:20px; font-family: 'Danmark Medium';//change as necessary } .Mobile-overlay-folder { padding-top:100px; } .Mobile-overlay-folder-item--toggle-label { font-family: 'Danmark Medium'; } The image of what the issue looks like on a mobile screen is attached. I've also attached a screen recording of the issue. Hopefully someone can help me narrow this down! RPReplay_Final1586874343 2.MP4
  6. Anyone have CSS code to change the word Menu to the hamburger icon on mobile navigation? Thanks!
  7. We've got a carousel/slideshow that looks good on Desktop however doesn't look good on mobile view (images are cut off). We'd like to just disable it entirely for mobile users. Does anyone know if this is possible? We are using Bedford. Thanks,
  8. Hey all of you, I am using the Five-Template and trying my luck making it multilingual.For that I followed Penias tutorial and it works for non mobile devices. I used the snippet : collection.ID #mobile-navigation ul li:nth-child(even) { display:none}It seems to work for the main navigation so far but as soon as I click a folder all the blank links appear. Does anyone of You have a solution for hiding elements from active-folder? -FolderLink1blankLink2 blankLink3blank Kind regards,Passik
  9. Hello, As per this question: https://answers.squarespace.com/questions/34364/force-desktop-browser-to-use-the-hamburger-menumobile-navigation-drawer-instead-of-the-traditional-navigation-link-toolbar I would like to know the same thing, however I would like the three line "hamburger" menu to be default and remain at all browser/viewing sizes. I am using the Bryant template. If anybody has the answer to this it would be much appreciated! Thanks, Natalia
×
×
  • Create New...