Могу ли я заставить браузеры WebKit показывать идентификатор фрагмента? - PullRequest
Новая
       3

Могу ли я заставить браузеры WebKit показывать идентификатор фрагмента?

0 голосов
/ 29 октября 2010

Я использую jQuery и идентификатор фрагмента для создания изменения состояния в зависимости от того, на какую часть одностраничного сайта в данный момент смотрит пользователь.

Я наконец-то заставил это работать, но каки Safari, и Chrome не будут отображать идентификатор фрагмента. Я не могу превратить его в переменную, и поэтому система выходит из строя.

Есть ли способ принудительно применить это действие специально для браузеров WebKit или другой способ доступафрагмент?

edit: добавлен код ниже 

(function($){
$.fn.sectionMove = function() {

    return this.each(function() {          
    $(this).click(function() {
            if(window.location.hash){
                  var $hash = window.location.hash;
            } else if (!window.location.hash) {
                  var $hash = '#section1';
            }
            $n = $hash.substring($hash.length-1,$hash.length);

            $("div#headerNav ul li:nth-child(" + $n + ") a").removeClass('on');

            var $anchor = $(this);
            $('html, body').stop().animate({
                scrollTop: $($anchor.attr('href')).offset().top
            }, 1000,'easeInOutExpo', function(){
                var $hash = window.location.hash;
                $n = $hash.substring($hash.length-1,$hash.length);
                $("div#headerNav ul li:nth-child(" + $n + ") a").addClass('on');
            });
            event.preventDefault(); 
        });
     });

   };
})(jQuery);

1 Ответ

1 голос
/ 30 октября 2010

Мне удалось решить это самому.Проблема была со следующими строками моего jquery: 

$('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top

Хотя это позволило плавной прокрутке иметь место на странице, она переместилась на якорь без обновления URL с идентификатором фрагмента.

Если кому-то интересно, как выполнить то же самое, то приведенный ниже код должен помочь.Я изменил его для своих собственных нужд, но кредит должен идти на Arial Flesler (http://www.learningjquery.com/2007/10/improved-animated-scrolling-script-for-same-page-links)

function filterPath(a) {
        return a.replace(/^\//, '').replace(/(index|default).[a-zA-Z]{3,4}$/, '').replace(/\/$/, '')
    }

    var e = filterPath(location.pathname);
    var f = scrollableElement('html', 'body');
    $('a[href*=#]').each(function () {
        var b = filterPath(this.pathname) || e;
        if (e == b && (location.hostname == this.hostname || !this.hostname) && this.hash.replace(/#/, '')) {
            /*var anchor1 = window.location.hash; */
            var c = $(this.hash),
                target = this.hash;
            if (target) {
                var d = c.offset().top;
                $(this).click(function (a) {        

                    a.preventDefault();
                    $(f).animate({
                        scrollTop: d
                    }, 1000,'easeInOutExpo', function () {
                        location.hash = target
                        $("div#headerNav ul li a").removeClass('on');

                        $n = target.substring(target.length-1,target.length);
                        $("div#headerNav ul li:nth-child(" + $n + ") a").addClass('on');

                    })
                })
            }
        }
    });
...