Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in

Next challenges

Recent achievements

  • Global
  • Personal

Recognition

  • Give kudos
  • Received
  • Given

Leaderboard

  • Global

Trophy case

Kudos (beta program)

Kudos logo

You've been invited into the Kudos (beta program) private group. Chat with others in the program, or give feedback to Atlassian.

View group

It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage
Highlighted

When using AUI Tabs, clicking on the tab causes the page to scoll.

Nicolas Castel had asked this question, but I couldn't comment with my answer so I'm starting a new post.

I've had this problem with the Keysight HTML Elements.  I think I finally found the answer so I'll share.

The AUI Tabs relies on some simple html - an unordered list of anchors for the menu items and a matching set of div tags. See https://docs.atlassian.com/aui/8.5.1/docs/tabs.html  for details. When the tab is clicked, two things happen.  First, some javascript changes the visibility of the tabs so that only the one selected is shown.  This is desired behavior.  Next, the browser scrolls down to the anchor.  It's this second behavior which is annoying and needs to be stopped.

My solution is to add a custom class, keysight-tab-menu-item-anchor, to the anchor tags so they are easy to extract with jQuery, then insert the following javascript:

AJS.toInit(function(){
AJS.tabs.setup();

// Without this hook, Confluence will scroll the page
// so that the top of the tab is at the top of the screen.
// This code triggers the tab change, than stops propagation
// or the event so the page is not scrolled.
$(".keysight-tab-menu-item-anchor").click(function(e){
AJS.tabs.change(jQuery(this), e)
e.preventDefault()
e.stopImmediatePropagation();
});
});

 This code seems to work just fine. :)

0 comments

Comment

Log in or Sign up to comment
TAGS
Community showcase
Posted in Confluence

What do you think is the most *delightful* Confluence feature? Comment for a prize!

- Create your own custom emoji 🔥 - "Shake for Feedback" on mobile 📱 - An endless supply of GIFs via GIPHY 🤩 Is there anything quite as nice as a pleasant surprise? Comment below with what...

323 views 23 8
Join discussion

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you