how to link to a same page anchor in javascript

Question

I am wanting to link the album covers in the coverflow mighty slider to anchors within the same page. It is at the top and there are various audio players corresponding to each cover, each with their own anchor, below within the page. How do I use the link url property to go to an anchor. The anchor for this album danceawaythenight is dan.

Have already tried an link either side of the list item but it just makes the album cover disappear.

The code I am working with from the slider is shown below.

Each album cover has a link like the one below (at the moment in is pointing to the default link that came with the plug-in slider)

<li class=”slide” data-mightyslider=” cover:’images/albumcovers/danceawaythenight.jpg’, link: { url: ‘https://itunes.apple.com/us/album/enrique-iglesias-greatest/id295364999?uo=4’, target: ‘_blank’ } ”>

Answer 1

You can get the coordinate of the target element and set the scroll position to it.

Here is a easier way to do that:

function jump(h){
    var url = location.href;               //Save down the URL without hash.
    location.href = "#"+h;                 //Go to the target element.
    history.replaceState(null,null,url);   //Don't like hashes. Changing it back.
}​

This uses replaceState to manipulate the url. If you also want support for IE, then you will have to do it the complicated way.

function jump(h){
    var top = document.getElementById(h).offsetTop; //Getting Y of target element
    window.scrollTo(0, top);                        //Go there.
}​

Answer 2

You probably need to set the link-url according to your anchors. and the link-target to "_self" or "_top".

<li class=”slide” data-mightyslider=” cover:’images/albumcovers/danceawaythenight.jpg’, link: { url: ‘#your-anchor-name’, target: ‘_self’ } ”>