anchor issues

1

Smooth Scroll has the wonderful attribute of allowing one to adjust the vertical position of an anchor so it can be positioned below rather than behind a fixed header. This works great when navigating around the page with anchors, but does not work at all when coming to an anchor from a different page. Is there a workaround for this?

2

I have some nested anchors on one of my pages to be accessed from other pages on and off the site. They work fine in Chrome and Firefox. But don’t work in Safari and IOS: one is instead taken to the top of the page in which the anchor exists.

In looking at info accessed through a link by a relatively old post on this site, w3schools notes that nested anchors are verboten. Am wondering if that is still the case: Am I am dealing with forgiving Chrome and Firefox browsers, or laggard Safari and iOS browsers?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

If you hand-code (Hyperlink dialog; use the External tab; enter the URL yourself) the link to the page, and substitute a ? for the # in the URL, so it changes from http://example.com/page.html#anchor to http://example.com/page.html?anchor

This is a bit of a hack, but it was built for exactly this problem.

Walter

On Jun 22, 2015, at 7:37 PM, Peter Laundy email@hidden wrote:

Smooth Scroll has the wonderful attribute of allowing one to adjust the vertical position of an anchor so it can be positioned below rather than behind a fixed header. This works great when navigating around the page with anchors, but does not work at all when coming to an anchor from a different page. Is there a workaround for this?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

If you hand-code (Hyperlink dialog; use the External tab; enter the URL yourself) the link to the page, and substitute a ? for the # in the URL, so it changes from http://example.com/page.html#anchor to http://example.com/page.html?anchor

This isn’t working. It is sending me to the top of the page rather than the anchor.

As an example go to:

http://www.brockmanfamilyfarming.com/terras-writings.html

In the first paragraph of text you will find two temporary links to illustrate the issue.

The first (five generations…) uses a normal internal link to the Family History anchor on the “The Family” page. In Chrome and Firefox the link takes you to the anchor, though the top is hidden behind the fixed header. (In Safari the link takes you to the top of the relevant page)

The second link (Terra) uses an absolute link with a “?” to the same anchor. In all three browsers the link takes one to the top of “The Family” page.

(Hope this works this time. My previous attempt at this post didn’t work)


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Try this instead

This may be because you are stripping the .html from the end of the file name.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

No, apparently this version of the SmoothScroll Action is missing the external scroll-to code. Can you check the Forge and see if your version is the latest available?

Walter

On Jun 23, 2015, at 7:12 PM, DeltaDave email@hidden wrote:

Try this instead

Brockman family farmer and writer bios, plus centennial farm history.

This may be because you are stripping the .html from the end of the file name.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

David,

Using your suggested code makes the link to the anchor now work in Safari as well as Chrome and Firefox, though across browsers it does not fix the problem of the anchor appearing behind rather than below the fixed header. The “Terra” link now uses the code you suggested if you want to check out how it works.

Concerning stripping out the .html. I am interpreting this to mean that you were referring to the code in my .htaccess file to hide the .html (suggested in Caleb Grove’s blog post on .hta access files)

So I tried removing this item from my .htaccess file using Cyberduck to edit the file. Strange thing was that I then got 404 errors on the “Terra’s Writings” and “More Writings” pages but no others. To check whether the link was wrong or the page name was wrong, I also typed in the URL for each page based on what showed in the FW Inspector window for each page and also got the 404 error.

Felt like I was playing with fire messing with the .htaccess file without enough understanding. So I put the html hiding code back in and the 404 error disappeared.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Walter-
It is the latest: 0.5.4

David is perhaps onto something as his suggestion gets Safari to recognize anchors. Right now it doesn’t recognize either the code you suggested to fix the fixed head issue, nor internal links created using FWs pop-up link list at the bottom of the page.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

I doubt that is it entirely. Adding the #foo to the end of the URL is just getting the correct order of things in the URL – it’s the anchor segment of the URL that does the work natively in the browser. You are correct that the code is not there at all, I must have been mis-remembering things. Maybe this is built into Carousel – so you can link to a particular pane and have it scroll into view after the page loads.

Here’s a super-simplified version of the code generated by this Action that will do the scroll to the element on page load and do the offset. This would work with the ?anchor (replacing #anchor) link:

If you test this in a page that has no Actions applied to it, use both blocks of code (the links to Prototype and Scriptaculous on the top of the page, and the script block at the end of the body tag). If you add this to a page that already loads Prototype (such as this page we’ve been looking at) then DON’T ADD the two links to Prototype and Scriptaculous, because they are already added by the Action. This code will run fine alongside the rest of the code in your page. It will not hijack any anchors within the page, as the SmoothScroll Action does.

I hope it’s self-documenting enough for you – fiddle with the duration and offset numbers to change the speed and distance away from the top of the effect.

Walter

On Jun 24, 2015, at 8:04 AM, Peter Laundy email@hidden wrote:

Walter-
It is the latest: 0.5.4

David is perhaps onto something as his suggestion gets Safari to recognize anchors. Right now it doesn’t recognize either the code you suggested to fix the fixed head issue, nor internal links created using FWs pop-up link list at the bottom of the page.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
List Options | FreewayTalk


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Alrighty, then!

It works with “?anchor” with or without “.html” in Safari and iOS as well as the other browsers I tested.

Once again, muchas gracias!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options