Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #213575

    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!

    #213877

    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

    #214325

    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

    #214505

    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?

    #214683

    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

    #215597

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

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