$ (': target') returns a length of 0 in Internet Explorer 11

I am trying to compensate for the position of the anchor on a web page so that it is not covered by a fixed header.

I solved the problem with this anwser and it works fine for every browser except IE. It just scrolls a few pixels after moving the anchor.

The code is as follows:

(function($, window) {
    var adjustAnchor = function() {

        var $anchor = $(':target'),
                    fixedElementHeight = 160;
        console.log("Anchor: "+ JSON.stringify($anchor));

        if ($anchor.length > 0) {
            $('html, body')
                .stop()
                .animate({
                    scrollTop: $anchor.offset().top - fixedElementHeight
                }, 200);
        }
    };

    $(window).on('hashchange load', function() {
        adjustAnchor();
    });

})(jQuery, window);

Now the output in console.log in IE11 is this:

{
    "length": 0,
    "prevObject": {
        "0": {
            "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false,
            "_html5shiv": 1,
            "jQuery1111049273906621767055": 4
        },
        "context": {
            "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false,
            "_html5shiv": 1,
            "jQuery1111049273906621767055": 4
        },
        "length": 1
    },
    "context": {
        "__IE_DEVTOOLBAR_CONSOLE_EVAL_ERROR": false,
        "_html5shiv": 1,
        "jQuery1111049273906621767055": 4
    },
    "selector": ":target"
}

The problem is truncated by "length": 0, which means that nothing is selected. Why is this? Selector: should work fine in IE11, but jQuery does not capture it.

Sorry my ignorance in jQuery and my bad english.

+4
source share
1

, id name , :

<a class="anchor" name="condiciones" id="condiciones"></a> 

- name , , jQuery Internet Explorer, id.

IE.

+2

Source: https://habr.com/ru/post/1621979/


All Articles