CSS/Javascript для извлечения начальной страницы (не #one)

Question

У меня есть слайдер. В слайдере у меня 3 изображения. Слайдер вращается между изображениями. У меня также есть "быстрый" набор из 3 кнопок. Пользователи могут нажимать каждую из 3 кнопок и будут направлены к соответствующему изображению. Когда изображение показывается, кнопка быстрого изменения меняется. (например, когда выбрано изображение 3, QuickNAV 1 и 2 будут черными, а QuickNAV 3 - голубыми).

Мой ползунок работает нормально, за исключением того, что на самом первом изображении нет ярлыка, отображаемого в index.html. Это потому, что быстрые проверки "выбраны #one, #two, #three"? Если это так, покажите соответствующий кусок. Но, когда это просто index.html (что соответствует #one), синий цвет QuickNAV не отображается.

По сути, мне нужно добавить что-то вроде следующего в код ниже, но я не знаю правильный синтаксис: .slider /:target ~ .quicknav a[href="/"]

CSS это:

.slider #one:target ~ .quicknav a[href="#one"] {
    background:
        url(images/navpick1.png),
        url(images/quicknav-hover.png);
}
.slider #two:target ~ .quicknav a[href="#two"] {
    background:
        url(images/navpick2.png),
        url(images/quicknav-hover.png); 
}
.slider #three:target ~ .quicknav a[href="#three"] {
    background:
        url(images/navpick3.png),
        url(images/quicknav-hover.png); /*On current image hover for quicknav */
}

Вот решение Javascript

//Start at #one so it looks normal
if (window.location.hash === "") {
    if (window.pageYOffset!= null){
        st=window.pageYOffset
    }
    if (document.body.scrollWidth!= null){
        st=window.pageYOffset
    }
    window.location.href = "#one";
    setTimeout('window.scrollTo(0,st)',0);
}

Answer 1

Это было очень полезно -

Я добавил следующий код в начало JavaScript

if (window.location.hash === "") {
    window.location.href = "#one";
}

Похоже, это делает то, что вы хотите сделать.

JSFiddle