Блог

Сайт находится @ beattrainsoundsystem.com/home

Я использую serialScroll для анимации нескольких разделов, содержащих танцующих персонажей, и использую localScroll для анимации разделов содержимого. Моя проблема в том, что при попытке загрузить URL-адрес с хэшем (например beattrainsoundsystem.com/home#store ) символы divs не анимируются в правильном положении. Я знаю, что для того, чтобы это произошло, мне нужно создать условную функцию для настройки «start:», чтобы изменить значение «start:» в зависимости от хэша в URL. Будучи в некоторой степени новичком в jQuery, я не совсем уверен, как это закодировать.

Я уже использую плагин для синтаксического анализа URI для возврата хэша в URL, поэтому для «http://www.beattrainsoundsystem.com/home#store«

 var urlHash = $.url.attr('anchor');
  

вернет «сохранить»

Итак, что мне нужно, так это функция, которая говорит:

 if (urlHash == home) {
     var start = 0
} else if (urlHash == mixes) {
     var start = 1,
} else if (urlHash == contact) {
     var start = 2,
}
  

Очевидно, что это неверно закодировано, но является концептуализацией скрипта, который мне нужен для выполнения этой работы.

Спасибо за вашу помощь!

Вероятно, вам следует интегрировать это с localScroll. Если вы вызовете $.localScroll.hash(), она прокрутит до элемента, на который указывает хэш, и уведомит об изменении serialScroll.

Мне не сразу бросается в глаза, где обрабатываются события нажатия для ссылок вверху, которые я пытался найти, чтобы привести конкретный пример.

Похоже, единственный раз, когда анимация не работает, это когда я перехожу непосредственно на какую-то страницу, у которой есть хэш в URL. Итак, я мог бы сделать что-то вроде:

1. При загрузке страницы возьмите #name из URL-адреса
2. Найдите элемент, чье href = имя я захватил (у вас они названы одинаково, лучше было бы дать им <a href="#name"> идентификатор, такой как <a id="name" href="#name">
3. Выполните событие click() для этого элемента, чтобы имитировать обычный метод анимации

Это не идеально, если вы хотите, чтобы он загружался в правильном положении без показа анимации.

Вы должны быть в состоянии сделать что-то вроде этого:

 $(document).ready(function(){
      // This whole part is pseudocode since I didn't spend
      // the time to find exactly how you're doing things

      // get the hash portion from the URL
      // (just copying you here, haven't done this myself)
      var sourceLinkHref = $.url.attr('anchor');

      // Find the <a> tag whose href attribute matches the
      // name you just found, and .click() it
      $("a[href=#"   sourceLinkHref   "]")
          .click();
   });
  

 jQuery(function( $ ){
var urlHash = $.url.attr('anchor');
if (urlHash=="mixes") {
    $("#sectionsContent").scrollTo( $("#mixes"), 0 );
    $("#sectionsMid").scrollTo( $("#mixmid"), 0 );
    $("#sectionsTop").scrollTo( $("#mixTop"), 0 );
    $("#sectionsBottom").scrollTo( $("#mixBottom"), 0 );
}

if (urlHash=="contact") {
    $("#sectionsContent").scrollTo( $("#contact"), 0 );
    $("#sectionsMid").scrollTo( $("#storemid"), 0 );
    $("#sectionsTop").scrollTo( $("#storeTop"), 0 );
    $("#sectionsBottom").scrollTo( $("#storeBottom"), 0 );
}

if (urlHash=="store") {
    $("#sectionsContent").scrollTo( $("#store"), 0 );
    $("#sectionsMid").scrollTo( $("#blogmid"), 0 );
    $("#sectionsTop").scrollTo( $("#blogTop"), 0 );
    $("#sectionsBottom").scrollTo( $("#blogBottom"), 0 );
}
  

});