Home>

A portfolio site is under construction. There was a problem that could not be solved even after a long period of research.
I tried to make the angle icon fade in repeatedly with jQuery from the moment I opened the site, but it does not respond and does not work. I would like somebody to teach. The version of jQuery is 3.5.1. I download it from the official website, put it in a file and read it.

(function ($) {
    $(function () {
        let $element = $("# fadeInIcon");
        setInterval (function () {
            $element.fadeIn (500);
        }, 1000);
    });
}) (jQuery);


* The jQuery file name isrepeat_jquery.js..

~abridgement~
<span></span>
~abridgement~
</footer>
<!-Loading jQuery (3.5.1)->
<script src = "./_ common/scripts/jquery-3.5.1.min.js"></script>
<script type = "text/javascript" src = "./ repeat_jquery.js"></script>
</body>
</html>


* HTML is omitted before and after.

  • Answer # 1

    It doesn't disappear because it hasn't been erased.

    // in setInterval
        $element.fadeIn (500, function () {
            $element.fadeOut (500);
        });
    <span id = "fadeInIcon"></span>


    Shouldn't it be?

  • Answer # 2

    First, check if you can incorporate fontawesome.
    for fontawesome csslinkDo you write the element in html?
    Can you see the angle icon when you open the page?

    Also, if you want to fade in, you have to hide the icon first to see the change, right? When the page loads,$element.hide ()let's do it.

    And after fading in for 500msec, I want to hide it again, so

    $element.fadeIn (500, function () {$(this) .hide ();});

    How is it like that?