Link to a tab

Sadly, I confirmed just now that the code you kindly wrote doesn’t work in the browser (although it does work in Blocs Preview). In my case, it is a text link on the same page as Tabbed Content. In Safari and Firefox, when I click my text link I associated with the tab, the tab gets clicked (opened/expanded), but the browser won’t scroll to it! And yes, the URL in the address bar is correct, hashtag and all. In FireFox it’s even worse. Not only will it NOT scroll to the tab, but the tab doesn’t get clicked/expanded!

Like @apswoodwork I have other code in Page Settings. And yes, I put your code in the Footer, but that doesn’t matter.

I also tried the code provided below by “dubbed” but the result is the same. Works great in Blocs Preview but not in FireFox or Chrome or Safari!

Same problem with the following code provided by “dumP”:

I then made appropriate modifications to the JS code shown in Step3 on the following page, but the result is exactly the same! Doesn’t work!

After doing all those tests locally, I then uploaded the page to my web server and tried again. Nope. Still fails.

Now here’s the kicker. If I press and hold the CMD key and click my text link, it opens a new tab in the browser with the correct tab (on the web page) opened! That shows me the code is not about to reload the same web page properly in the browser for some reason. Opening the same web page in a new Tab works though. But why?

That wasn’t the purpose of this code. It makes a tab active when opening a new page. Not the same page.

There is another thread that has what you’re after from memory. There were a lot of threads around tabs at one stage not long ago.

I’ve searched this forum, but nothing pertains to “link to tab on same page.” :frowning:

There must be some reason the browsers aren’t allowing the page to reload properly such that the tab will be opened and scrolled to.

The JavaScript opens the tab after the page has loaded.

I was working on a better version of this that would support opening tabs and scrolling etc using attributes in the URL. But It became a low priority. I was going to make it a custom bric at some stage.

Well, I’ve spent a couple hours on it in vain today, so I’m ready to give up. I simply don’t understand why it works fine on the following fiddle but not in Blocs! Ack!

UPDATE#1: By adding “data-toggle = tab” to Custom Attributes for my text link, I am now getting the tab content to display and scroll to work, but the problem is that the content displays with the wrong tab selected!

UPDATE#2: Here’s a single page document with the code I am using. Preview it in Blocs and click “TEST LINK” to see the PDF content open. The problem is the FEATURES tab is selected, but that PDF content is linked to the “PDFs” tab. Any ideas how to fix that? (In other words, after clicking “TEST LINK” the PDF content should appear with its “PDFs” tab selected.)

@Pealco Any thoughts on my test document in UPDATE#2 above? Another problem I just found today is that the link only works 1 time. If you switch to another tab and then click “TEST LINK” a second time, it does nothing. :frowning:

I’ve created my own thread here in hopes of getting more eyes on this serious problem in hopes of an answer for all Blocs users.

This is an interesting thread.
The function link to tab is indeed highly wanted.
I´ll put this into the whish list foe blocs 4
Thanks for all your efforts.

1 Like

@pixelwork
Desired - agreed.
@JDW
Serious problem - really??
New thread - Why; it gets notices, found in a search, worked on, tested, what’s the gain?

1 Like

I want to encourage someone knowledgeable out there to kindly provide a quick solution. You’d think with Corona we’d have more people at home reading and participating in this forum, but such is not the case. I want as many eyes on the subject as possible so a solution can be found long before Blocs 4 hits, hence my new thread. That new thread may seem redundant, but I’m eager to see if it does some good. I sent Norm an email about it too, so fingers crossed!

Hi.
This looks promising; I’ll give it a go when I get on the laptop.
:crossed_fingers:

Hello, sorry to interrupt this topic, but @Norm helped @JDW about this in a different topic. There you have his help about this:

Hope it helps you all … it helps me… :crazy_face:

1 Like

Thanks @Pealco , yeah that opens tab on the same page. Funny enough there was already a thread about that somewhere if I recall.

This is about targeting a tab on another page and then scrolling to it.

1 Like

Hi @Pealco
In the waffle in that thread is a reply to the question I asked @Norm
And I quote,
Reply from Norm.
" Hi Andy,
Yeah that will not work as the tab is controlled by JS and when you navigate to a new link you cant tell the new page to run a JS function as JS hasn’t even been loaded for the page.
​Navigating to a page and setting the active tab based on link, would require PHP I think."
Peace and love my friends :love_you_gesture:t2:
PS
I had to give up and split the design over 3 pages.
It worked out for the best as it turned out I also had an issue with a script from an Instagram plugin I use.

I changed the way this was waiting for the page to finish loading also. I think that helps too.

You’r right… yes in different page it will be difficult to scroll to that specific point (with windows on.load) as if this page have different content then when the page loads it will scroll always to that point.

Yes, I hope to solve it though. But for the moment, URL parameters seems to be more reliable than using hash.

The strange behavior is if you create a html bric inside each tab with a div inside like tab-1 / tab-2 / tab-3 then in the first page you can call that specific div by calling href like page2.html#tab-1

Then you will see opening the second page and scrolls to that tab, but if you create a second link in the first page to the next div it will open the second page but down scroll to the second tab…

An easy solution is just to add another parameter that scrolls to the bloc ID that has the tabs. Regardless of what tab is open.

But that’s too easy :stuck_out_tongue_winking_eye: :stuck_out_tongue_winking_eye:

My current semi working code, grabs the parent DIV of the active Tab.

waiting for result, remember to put a donation PayPal button… :joy: :joy: :joy:

:rofl:

ops…