Announcement

Collapse
No announcement yet.

Colossus Mega Menu drop down issue

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Colossus Mega Menu drop down issue

    When you first come to the page and click the button to open the mega menu, the menu opens in the correct location. If you slightly scroll down and click the button to open the mega menu, the menu opens at the top of the page. This also happens if you scroll down the page and then come back to the top, the menu opens at the top of the page instead of "anchored to the nav bar. You can see it here. How do I fix it?
    Leslie Kirk
    Miva Certified Developer
    Miva Merchant Specialist since 1997
    Previously of Webs Your Way
    (aka Leslie Nord leslienord)

    Email me: [email protected]
    www.lesliekirk.com

    Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

    #2
    Not sure how to fix it because it's losing its position at the top of the container. But the one thing I notice, shouldn't there be a sticky menu when scrolling beyond the main nav?

    Scott
    Need to offer Shipping Insurance?
    Interactive Design Solutions https://www.myids.net
    MivaMerchant Business Partner | Certified MivaMerchant Web Developer
    Competitive Rates, Custom Modules and Integrations, Store Integration
    AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
    My T-shirt Collection is mostly MivaCon T-shirts!!

    Comment


      #3
      Originally posted by ids View Post
      Not sure how to fix it because it's losing its position at the top of the container. But the one thing I notice, shouldn't there be a sticky menu when scrolling beyond the main nav?

      Scott
      They requested it be turned off - BUT the could be part of the issue.
      Leslie Kirk
      Miva Certified Developer
      Miva Merchant Specialist since 1997
      Previously of Webs Your Way
      (aka Leslie Nord leslienord)

      Email me: [email protected]
      www.lesliekirk.com

      Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

      Comment


        #4
        Originally posted by lesliekirk View Post

        They requested it be turned off - BUT the could be part of the issue.
        It is. You'll notice that the fasten navigation script is injecting an inline style "top:0;". If they no longer need the sticky header, you can edit the script. Another quick workaround that will work is to use the following rule:
        .x-omega-navigation.is-open {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -ms-transform: scaleY(1);
        transform: scaleY(1);
        top: auto !important;
        }

        This declaration is the important part: top: auto !important;

        Hope this helps!
        -Ryan

        Comment


          #5
          Originally posted by RTHOMASDESIGN View Post

          It is. You'll notice that the fasten navigation script is injecting an inline style "top:0;". If they no longer need the sticky header, you can edit the script. Another quick workaround that will work is to use the following rule:
          .x-omega-navigation.is-open {
          opacity: 1;
          -webkit-transform: scaleY(1);
          -ms-transform: scaleY(1);
          transform: scaleY(1);
          top: auto !important;
          }

          This declaration is the important part: top: auto !important;

          Hope this helps!
          -Ryan
          Thanks Ryan - now they want it back on and I've hunting what I edited to turn it "off" LOL
          Leslie Kirk
          Miva Certified Developer
          Miva Merchant Specialist since 1997
          Previously of Webs Your Way
          (aka Leslie Nord leslienord)

          Email me: [email protected]
          www.lesliekirk.com

          Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

          Comment


            #6
            Hey Ryan RTHOMASDESIGN I've got it turned back on and as long as it's scrolling down the page, it works great. But as soon as it returns back to the top that inline style "top:0;" is inserted. Do I need to go ahead and insert the top: auto !important;? Thanks!
            Leslie Kirk
            Miva Certified Developer
            Miva Merchant Specialist since 1997
            Previously of Webs Your Way
            (aka Leslie Nord leslienord)

            Email me: [email protected]
            www.lesliekirk.com

            Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

            Comment


              #7
              No, now that you've reimplemented the sticky header you wouldn't want to use that declaration. The way Colossus is supposed to work, is it will alternate the inline style from "top: 58px (or whatever the sticky element's height is)" to "top:auto" when the user scrolls to the top of the page. In your case it's alternating from "top: 58px" to "top: 0".

              You need to edit your omega navigation script. Change the following:
              from:
              else {
              omegaNavigation.style.top = '0';
              }

              to:
              else {
              omegaNavigation.style.top = 'auto';
              }

              That'll fix it.
              Hope this helps :)

              Comment


                #8
                Hmmmm, the admin is giving me a file not found when I try to edit the source of the omega-navigation.js
                Leslie Kirk
                Miva Certified Developer
                Miva Merchant Specialist since 1997
                Previously of Webs Your Way
                (aka Leslie Nord leslienord)

                Email me: [email protected]
                www.lesliekirk.com

                Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

                Comment


                  #9
                  Huh, I'd just edit via FTP. The file is located here: /Merchant2/themes/colossus/extensions/navigation/omega/omega-navigation.js. If you have further trouble feel free to PM/email me ;)

                  Comment


                    #10
                    Originally posted by RTHOMASDESIGN View Post
                    Huh, I'd just edit via FTP. The file is located here: /Merchant2/themes/colossus/extensions/navigation/omega/omega-navigation.js. If you have further trouble feel free to PM/email me ;)
                    Thanks again Ryan for all your help! Stupid caching issues....
                    Leslie Kirk
                    Miva Certified Developer
                    Miva Merchant Specialist since 1997
                    Previously of Webs Your Way
                    (aka Leslie Nord leslienord)

                    Email me: [email protected]
                    www.lesliekirk.com

                    Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

                    Comment


                      #11
                      No problem Leslie!! Glad you got it working again :)

                      Comment

                      Working...
                      X