Support » Theme: Twenty Twenty » Possible bug? Anchor Links don’t work in js flow out menu

  • Resolved t.schwarz

    (@tschwarz-1)


    Hi,

    I’m experimenting with twentytwenty and I’m running into an issue with anchor links in the extended / flow-out menu. While a link like “[page]/#position” will work when used in a horizontal menu (reaction: soft scroll to #position), it does not cause any reaction when clicked in the flow-out Javascript menu.

    Not sure if there are any specific requirements for #anchor links in the flow out menu, but if not, this may be a bug.

    Thanks for your help!

Viewing 4 replies - 1 through 4 (of 4 total)
  • You’ll need to edit twentytwenty/assets/js/index.js:

    After line 156 add:

    goToAnchor: function() {
    	document.addEventListener( 'click', function( event ) {
    		var target = event.target;
    		
    		if ( target.closest( '.modal-menu' ) && 'a' === target.tagName.toLowerCase() ) {
    			this.untoggleModal( target.closest( '.cover-modal.active' ) );
    
    			if( '' !== target.hash ) {
    				setTimeout( function() {
    					var fakeEl = document.createElement( 'a' );
    
    					fakeEl.href = target.hash;
    					fakeEl.click();
    				}, 550 );
    			}
    		}
    	}.bind( this ) );
    },

    After line 105 add:
    this.goToAnchor();

    Remember to clear your browser’s cache before trying to see if it works.

    • This reply was modified 1 year, 10 months ago by acosmin.
    • This reply was modified 1 year, 10 months ago by acosmin.
    • This reply was modified 1 year, 10 months ago by acosmin.

    While waiting for a fix for this, I’ve found the simplest and most reliable issue is to simply have the page reload.

    
    
    $( ".mobile-menu a" ).click(function() {
      window.location.href = this;
      location.reload();
    });
    
    
    • This reply was modified 1 year, 7 months ago by trbelt88. Reason: forgot to add hash to url before reloading
    • This reply was modified 1 year, 7 months ago by trbelt88. Reason: removed invalid function name

    Hi @trbelt88 i like your solution (reload page) but where did I have to put that code?

    Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Possible bug? Anchor Links don’t work in js flow out menu’ is closed to new replies.