Adding Javascript/JQuery/CSS# effect to Site

Hi Everyone,

Helping out a friend with the above site and am trying to add a ‘slide-up’ JS effect to some images on a page. To do this I’m using the below code files;

JS file;

<script>
window.onscroll = function() {myFunction()};

function myFunction() {
    if (document.body.scrollTop > 750 || document.documentElement.scrollTop > 350) {
        document.getElementById("myImg").className = "slideUp";
    }
}
</script>

CSS in the style sheet;

.slideUp {
 animation-name: slideUp;
 -webkit-animation-name: slideUp;
 animation-duration: 1s;
 -webkit-animation-duration: 1s;
 visibility: visible;
}

@keyframes slideUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(70%);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}

@-webkit-keyframes slideUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(70%);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}

Image on the page I hope to ‘slide up’;

<img src="https://one-pillow.com.au/wp-content/uploads/2017/11/idea-pillow.png" id="myImg" alt="" width="150" height="150" class="responsive_image"/>

All the files have been uploaded and I am linking these together in the header using the Google jQuery link;

<!– Google jQuery Tag –>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js”></script&gt;
<!– Google jQuery Tag –>`

I got this link for jQuery from here: https://www.w3schools.com/jquery/jquery_get_started.asp

I am able to create the effect separate notepad++ docs but not in my wordpress site. Is there something I’m missing or am doing wrong?

Any help/advice/links to articles is much appreciated.
Thank you in advance to anyone who can help.

The page I need help with: [log in to see the link]