window.location.hash не работает? - PullRequest
0 голосов
/ 03 октября 2010

У меня есть ссылка (index.html#services) и <div id="services>, которые я пытаюсь изменить цвет фона, когда ссылка нажата, а затем исчезает. Я использую последний плагин jQuery и jQuery Color , а также:

$(document).ready(function(){
    if(window.location.hash === '#services') {
        var service = $('#services');
        var originalColor = service.css('background-color');

        service.css('background-color', '#FFEE9F').animate({
            'background-color': originalColor
        }, 3000);
    }
});

сделать подсветку, но она не работает. Кто-нибудь знает почему?

Ответы [ 2 ]

3 голосов
/ 03 октября 2010

Этот код запускается только при загрузке страницы, а не при нажатии на ссылку с хешем.Попробуйте перейти по ссылке (index.html#services) непосредственно из новой вкладки браузера, и она, вероятно, будет работать.Что вам нужно сделать, это запустить этот код при изменении хэша.В новых браузерах есть событие onhashchange, но в старых браузерах такого нет.Для старых браузеров вы можете опрашивать свойство hash время от времени, чтобы увидеть, изменилось ли оно.

Если случайно у вас есть определенный идентификатор (класс css, id, имя и т. Д.) В ссылках, которые вызываютанимацию, вы можете добавить click слушатель для запуска этого кода.Например:

function animateBackground() {
    var service = $('#services');
    var originalColor = service.css('background-color');

    service.css('background-color', '#FFEE9F').animate({
        'background-color': originalColor
    }, 3000);
}

$(function () { // shortcut to $(document.ready)
   $('.fade-bg').live('click', animateBackground);
   animateBackground();
});
0 голосов
/ 03 октября 2010

Или используйте

window.onhashchange = function(){
    if(window.location.hash === '#services') {
        var service = $('#services');
        var originalColor = service.css('background-color');

        service.css('background-color', '#FFEE9F').animate({
            'background-color': originalColor
        }, 3000);
    }
};

в зависимости от того, на какие браузеры вы нацелены.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...