Highlighted

JavaScript code for Scroll Down anchor ties not working

Community Beginner ,
May 01, 2018

Copy link to clipboard

Copied

Hello!

I have anchor ties that cut to different sections of my webpage. I was given this code in a tutorial so instead of cutting to my anchor ties, the website would scroll down to them. For some reason, it only scrolls down for one of my anchor ties, and the rest of them it still only cuts to them. I would like the Javascript to work so that all my anchor ties will be scrolled to when clicked on. Any help is appreciated! Thank you!

let anchorlinks = document.querySelectorAll('a[href^="#"]')

for (let item of anchorlinks) { // relitere

    item.addEventListener('click', (e)=> {

        let hashval = item.getAttribute('href')

        let target = document.querySelector(hashval)

        target.scrollIntoView({

            behavior: 'smooth',

            block: 'start'

        })

        history.pushState(null, null, hashval)

        e.preventDefault()

    })

}

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

Which tutorial and how old is it?

The demo I posted yesterday contains smooth scrolling from a  bit of jQuery code. 

Bootstrap Parallax Template - https://alt-web.com/

TOPICS
Learn Dreamweaver

Views

225

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

JavaScript code for Scroll Down anchor ties not working

Community Beginner ,
May 01, 2018

Copy link to clipboard

Copied

Hello!

I have anchor ties that cut to different sections of my webpage. I was given this code in a tutorial so instead of cutting to my anchor ties, the website would scroll down to them. For some reason, it only scrolls down for one of my anchor ties, and the rest of them it still only cuts to them. I would like the Javascript to work so that all my anchor ties will be scrolled to when clicked on. Any help is appreciated! Thank you!

let anchorlinks = document.querySelectorAll('a[href^="#"]')

for (let item of anchorlinks) { // relitere

    item.addEventListener('click', (e)=> {

        let hashval = item.getAttribute('href')

        let target = document.querySelector(hashval)

        target.scrollIntoView({

            behavior: 'smooth',

            block: 'start'

        })

        history.pushState(null, null, hashval)

        e.preventDefault()

    })

}

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

Which tutorial and how old is it?

The demo I posted yesterday contains smooth scrolling from a  bit of jQuery code. 

Bootstrap Parallax Template - https://alt-web.com/

TOPICS
Learn Dreamweaver

Views

226

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
May 01, 2018 0
Adobe Community Professional ,
May 01, 2018

Copy link to clipboard

Copied

Which tutorial and how old is it?

The demo I posted yesterday contains smooth scrolling from a  bit of jQuery code. 

Bootstrap Parallax Template - https://alt-web.com/

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 01, 2018 0