Forum Support

Shape 5
March 28, 2024, 12:37:21 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Improvement to "Menu Scroll To Section"  (Read 5037 times)
KlintWeb
Jr. Member
**
Offline Offline

Posts: 253

Gravatar


« on: May 08, 2016, 08:06:43 PM »

As You know I'm very satisfied with Your products.

But when we use "Menu Scroll To Section" on a site with "Floating Menu" we have a problem - the link position gets hidden behind the menu. I've tried to figure out what to do, but I couldn't find a solution without an override of the template index.php - and some CSS of course

I suggest that You add something like
Code:
<a class="anchor" name="s5_top_row1_anchor"></a>
just after
Code:
<div id="s5_top_row1">
in the index.php

The CSS can be something like the below, where the value of "top" can be set in Template Manager - the Vertex framework, to make it right depending of the hight of the Floating Menu
Code:
a.anchor {display: block; position: relative; top: -100px; visibility: hidden;height: 0;}
a.anchor:after {content"";}

If there already is a easier solution I'm looking forward to see it
« Last Edit: May 09, 2016, 03:15:42 AM by KlintWeb » Logged
mikek
Administrator
*****
Offline Offline

Posts: 28743



WWW
« Reply #1 on: May 09, 2016, 07:36:21 AM »

Hello,

The css you have posted above will give a permanent gap on that area, not just when you use the scroll link. So even if you use just the mouse scroll you'll see the gap.

I have tried before to put in a javascript adjustment that changes where the scroll stops, but haven't been successful. Anchors are by default meant to go directly to that ID with no offest, it's just a defautl browser behavior. If I were able to get in an offset option that you define in the template configuration, it would apply to all anchors, is that something you would be interested in? I am not sure if it can be done, but I can look some more into it.
Logged

Mike Knott
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
KlintWeb
Jr. Member
**
Offline Offline

Posts: 253

Gravatar


« Reply #2 on: May 09, 2016, 07:53:09 AM »

It's quite simple - if the Floating Menu is disabled, the default CSS value for the top has to be 0, and if it's enabled another default value - depending of the template, which can be changed by the user to make it fit to the design.
Of course it would be good with javascript to control the value of the top to reduce the amount of CSS tags in the index.php head. But it should not be that difficult with the addition of the a tag.

You don't need to do it just for me, but I'm sure many others would be happy if a good solution is added
« Last Edit: May 09, 2016, 08:08:08 AM by KlintWeb » Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.