0

There is a page on my ModX website that includes a couple of page jump links at the top for a few articles that are further down the page. This is the HTML for each of them:

<a class="jump" href="#article1">Article 1</a><br />
<a class="jump" href="#article2">Article 2</a><br />

<!-- and so on... -->

And before, the links were not working at all in IE 11 so I'm using the JavaScript here to check if the visitor is using IE and to perform the page jump:

var url = 'http://mywebsite/mywebpage';
$('a.jump').on('click', function(evt) {
    evt.preventDefault();
    var useragent = window.navigator.userAgent;
    if (useragent.indexOf("Trident") > -1 || useragent.indexOf("Edge") > -1) { // IE, Edge
        var href = $(this).attr('href');
        window.location.assign(url + href);
    } else { // anything else
        var href = $(this).attr('href');    
        href = href.substring(1, href.length);      
        window.location.assign('other/url#' + href); 
    }
});

I'm not sure if this is the best way to check for IE, but for now it seems to be working.

This works just fine in Chrome and Firefox, but if I click on one of the page jumps in IE it jumps correctly, but after a second passes it redirects to the homepage of my website.

I am using ModX Revolution 2.5.7.

EDIT: Microsoft Edge seems to redirect straight to the homepage. EDIT 2: Updated JS code to check for Edge properly.

hRdCoder
  • 579
  • 7
  • 30

2 Answers2

2

maybe evt.preventDefault() just inside the click function?

Lorenzo Catalano
  • 473
  • 2
  • 9
  • I had it there earlier, but it didn't affect anything so I removed it. I just tried it again and had the same result. – hRdCoder Jun 16 '17 at 19:21
  • You can disregard my previous comment. After I read @curveball's answer below, it turns out there was another script on the page that was preventing this from working. I removed that other script, and now this works perfectly. – hRdCoder Jun 27 '17 at 14:52
1

There is a page on my ModX website that includes a couple of page jump links at the top for a few articles that are further down the page.

I don't quite understand what you want to achieve. If you want visitors to actually open those links and read them, why not to just insert real links and make this basic html thing - browsing links - work?

If those articles are already present on the page (entirely or partly) as secondary content somewhere below the main article and you want just to draw visitor's attention by "jumping" to them without opening new tabs or loading another page, just in addition to <a href='#article1'></a> use <a name="#article1"></a> to indicate that place on your current page where the visitor should be scrolled to.

There are several issues with the piece of code you gave too.

First off, the way you check IE/Edge versions. As it has been pointed out in this answer, "Trident" is not a part of Edge user agent string nowadays. So, in case you want to target Edge, your condition isn't even triggered.

Also you don't need this: (url + href).toString() since both variables are already of type string. Just url + href.

Moreover, it feels as if there is another script on the page that handles clicks on links. I think we need the link to your page in question to check what is going on there. So, if you don't mind sharing the link, we could check more in depth.

curveball
  • 4,320
  • 15
  • 39
  • 49
  • I edited my post to reflect changes I made to allow it to check for Edge, as well as removing the "toString()" call that you mentioned was unnecessary. Along with that, it turns out that you were correct when you said there might be another script running on the page that handles clicks on links. Mistakenly, I removed that script to allow it to run before I could link to it from here, but that indeed was what was causing the problem. – hRdCoder Jun 27 '17 at 14:49
  • nice to hear :) and what about the effect of "jumping" you wanted to achieve with all this stuff? Is it working now as you intended? – curveball Jun 27 '17 at 15:43
  • It is working perfectly now, in each browser including IE and Edge (after fixing the code). The page itself is very long with different articles so there was a need to place the jump links at the top of the page. – hRdCoder Jun 27 '17 at 15:48
  • great! :) Good luck with your project! – curveball Jun 27 '17 at 15:49
  • I will need it. Thank you! :) – hRdCoder Jun 27 '17 at 15:54