Goldchain Posted November 15, 2022 Share Posted November 15, 2022 Hey gang! I have a custom image that in place of the title for my navigation folder and hovering over it causes it to rotate while revealing the dropdown navigation menu, however while hovering over the menu, the icon returns to it's original position. I'd like it to stay in it's rotated position as long as the navigation dropdown is being hovered over. Is this possible? Any suggestions are welcome! Thank you!! Link to comment
Beyondspace Posted November 15, 2022 Share Posted November 15, 2022 12 hours ago, Goldchain said: Hey gang! I have a custom image that in place of the title for my navigation folder and hovering over it causes it to rotate while revealing the dropdown navigation menu, however while hovering over the menu, the icon returns to it's original position. I'd like it to stay in it's rotated position as long as the navigation dropdown is being hovered over. Is this possible? Any suggestions are welcome! Thank you!! Can you share your site with the protected password so we can take a look? Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Goldchain Posted November 15, 2022 Author Share Posted November 15, 2022 3 hours ago, Beyondspace said: Can you share your site with the protected password so we can take a look? Yup! Here is my site 🙂 https://goldchain.studio/ Link to comment
Goldchain Posted November 15, 2022 Author Share Posted November 15, 2022 Just now, Goldchain said: Yup! Here is my site 🙂 https://goldchain.studio/ Also curious if there is a way to code the icon to rotate in mobile view as well, as it only rotates in desktop view at the moment. Link to comment
tuanphan Posted November 21, 2022 Share Posted November 21, 2022 On 11/15/2022 at 9:11 AM, Goldchain said: Hey gang! I have a custom image that in place of the title for my navigation folder and hovering over it causes it to rotate while revealing the dropdown navigation menu, however while hovering over the menu, the icon returns to it's original position. I'd like it to stay in it's rotated position as long as the navigation dropdown is being hovered over. Is this possible? Any suggestions are welcome! Thank you!! Add to Settings > Advanced > Code Injection > Footer <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $('a.header-nav-folder-title').hover(function(){ $(this).addClass("hover"); }); </script> <style> .hover:hover { transform: rotate(45deg); transition: all 2s ease-in-out 2s; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Goldchain Posted November 21, 2022 Author Share Posted November 21, 2022 11 hours ago, tuanphan said: Add to Settings > Advanced > Code Injection > Footer <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $('a.header-nav-folder-title').hover(function(){ $(this).addClass("hover"); }); </script> <style> .hover:hover { transform: rotate(45deg); transition: all 2s ease-in-out 2s; } </style> Thank you but is there a way to do this without having to do code injection? I would have to upgrade my account in order to do this. Link to comment
tuanphan Posted November 23, 2022 Share Posted November 23, 2022 On 11/22/2022 at 3:33 AM, Goldchain said: Thank you but is there a way to do this without having to do code injection? I would have to upgrade my account in order to do this. Try edit Site Footer > Add a Markdown Block > Paste that code Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Goldchain Posted November 24, 2022 Author Share Posted November 24, 2022 On 11/23/2022 at 3:11 AM, tuanphan said: Try edit Site Footer > Add a Markdown Block > Paste that code Hmm unfortunately that didn't work... 😞 Maybe it requires the update? Also any tips on how to enable the rotation for mobile as well? Link to comment
tuanphan Posted November 27, 2022 Share Posted November 27, 2022 On 11/24/2022 at 11:55 PM, Goldchain said: Hmm unfortunately that didn't work... 😞 Maybe it requires the update? Also any tips on how to enable the rotation for mobile as well? Can you keep this line? We can test code again easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment