Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • January 22, 2014 at 10:58 pm #213575
    brentwestwind

    I have followed the article on linking to an anchor here. http://kriesi.at/documentation/enfold/add-anchors-to-your-page-for-single-page-navigation/

    I have followed the steps and it is working, but the transparent menu is covering the top part of the box and covering the heading and other content

    You can see it here: http://staging.westwindchurch.org/about/new-here/#getting-connected

    This is not the case in your example: http://kriesi.at/themes/enfold/homepage/home-v7-one-page-portfolio/#portfolio

    How do I remedy this?

    Thanks in advance!

    January 23, 2014 at 3:21 pm #213877
    Devin

    Hey brentwestwind!

    Right now this is unfortunately an issue we have no fix for but we are working on one. The anchor is linked to directly but because of the menu being on top of it and not pushing it down it appears as though its in the incorrect place.

    On a single page the anchor links get a smooth scroll bit of javascript which prevents the issue from happening. Its only when going to an anchor from another page that the the menu overlap makes it seem like its incorrect.

    Regards,
    Devin

    January 24, 2014 at 10:20 am #214325
    Dude

    Hey!

    For a temporary fix you can try to insert this code at the very bottom of enfold/js/avia.js:

    
(function($){
    $(document).ready(function()
    {
        setTimeout(function(){jQuery('body').AviaCcrollCorrection({duration: 1000});}, 1500);
    });
})( jQuery );

// -------------------------------------------------------------------------------------------
// Scroll correction which removes the height of the menu if necessary
// -------------------------------------------------------------------------------------------

(function($)
{
    $.fn.AviaCcrollCorrection = function(options)
    {
        var defaults =
        {
            duration: 500,
            easing: 'easeInOutQuint'
        };

        var options = $.extend(defaults, options);

        var fixedMainPadding  = parseInt($('.fixed_header #main').css('padding-top'),10) / 2 || 0;
        fixedMainPadding += parseInt($('html').css('margin-top'),10);
        var hash = window.location.hash;

        if(hash != '' && hash != '#' && hash != '#prev' && hash != '#next')
        {
            var container = $(hash);

            if(container.length)
            {
                if(container.offset().top > fixedMainPadding)
                {
                    var target = container.offset().top - fixedMainPadding;
                    $('html:not(:animated),body:not(:animated)').animate({ scrollTop: target }, options.duration, options.easing);
                }
            }
        }
    };
})(jQuery);

    Cheers!
    Peter

    January 24, 2014 at 5:24 pm #214505
    brentwestwind

    Wow! Thanks for the fix. This really helps me out!

    If I want to put this in my child theme, where would I put it?

    January 25, 2014 at 3:26 am #214683
    Ismael

    Hey!

    Add this on the child theme’s functions.php:

    /*
 * Register frontend javascripts:
 */
if(!is_admin())
{
	add_action('wp_enqueue_scripts', 'avia_register_child_frontend_scripts', 100);
}

function avia_register_child_frontend_scripts()
{
	$child_theme_url = get_stylesheet_directory_uri();

	//register js
	wp_register_script( 'avia-default-child', $child_theme_url.'/js/avia.js', array('jquery'), 1, false );
}

    Create a js folder on the child theme then add a avia.js file. You can insert Dude’s code on the new avia.js file.

    Regards,
    Ismael

    January 28, 2014 at 2:10 am #215597
    Kriesi

    Hi!
    Next theme update should fix the issue ;)
    Regards,
    Kriesi

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Linking to Anchor – Menue covering’ is closed to new replies.