Условные операторы для навигации к якорю через Java Script

Общие вопросы по системе юкоз, вопросы по ucoz, вопросы без определенной темы

Условные операторы для навигации к якорю через Java Script

» » Сообщение:

Здравствуйте!

Есть скрипт

script Код: Выделить всё Развернуть
<script type="text/javascript">
 setTimeout(function () {jQuery(document).ready(function() {jQuery.scrollTo('#casing',800);});
 }, 2200);
 </script>

как поставить условие, чтобы при заходе на страницу происходило следующее:
1) скрипт проверял есть ли якорь #comment в адресе-url
2) если есть, то переходил бы к этому якорю
3) если нет, то к якорю #casing

Нашел в инете такой код

script Код: Выделить всё Развернуть
$(document).ready(function(){
var loc = window.location.hash.replace("#","");
if (loc == "") {loc = "link0"}

но не смог разобраться как написать условие... помогите! B)

java script, якорь, скрипт, if, условные операторы

Re: Условные операторы для навигации к якорю через Java Scri

Admin » » Сообщение:

Fearfire писал(а) › 26.01.2017, 18:45:как поставить условие, чтобы при заходе на страницу происходило следующее:
1) скрипт проверял есть ли якорь #comment в адресе-url
2) если есть, то переходил бы к этому якорю
3) если нет, то к якорю #casing

Как вариант, так:

Код: Выделить всё Развернуть
<script type="text/javascript">
if(window.location.href.indexOf('#comment')!=-1){
   setTimeout(function(){$(document).ready(function(){$.scrollTo('#comment',800);});}, 2200);
}else{
   setTimeout(function(){$(document).ready(function(){$.scrollTo('#casing',800);});}, 2200);
}
</script>

или так, что, в принципе, одно и то же.. только чуть более логично..

Код: Выделить всё Развернуть
<script type="text/javascript">
$(document).ready(function(){
   setTimeout(function(){
      if(window.location.href.indexOf('#comment')!=-1){
         $.scrollTo('#comment',800);
      }else{
         $.scrollTo('#casing',800);
      };
   }, 2200);
});
</script>


Re: Условные операторы для навигации к якорю через Java Scri

Admin » » Сообщение:

Fearfire писал(а) › 28.01.2017, 14:17:Только нет плавного перехода по ссылке с якорем #comment (#form_comment)

Может нет такого якоря?..

Fearfire писал(а) › 28.01.2017, 14:17:Только нет плавного перехода по ссылке с якорем #comment

А какой-либо переход есть?


Re: Условные операторы для навигации к якорю через Java Scri

Fearfire » » Сообщение:

Admin писал(а) › 29.01.2017, 02:06:Может нет такого якоря?..

Есть! На странице с полным фото и комментариями:

html Код: Выделить всё Развернуть
<div class="photo-slider u-center">
 ...
 <hr id="form_comment"></hr>
  ...

Пример

Admin писал(а) › 29.01.2017, 02:06:А какой-либо переход есть?

Да!
1) если переходим из альбома на страницу с фото, то скрипт перелистывает к #casing
2) если переходим из альбома на страницу с фото по ссылке на добавление комментариев,
то переход к якорю есть, но он не плавный
3) если отмотать на начало страницы и обновить её и в url-адресе есть якорь #form_comment,
то плавный переход к этому якорю есть



Re: Условные операторы для навигации к якорю через Java Scri

Fearfire » » Сообщение:

Admin писал(а) › 29.01.2017, 19:34:- Ну так, у якоря другое имя - #form_comment..

В скрипте я поправил на #form_comment ;)

script Код: Выделить всё Развернуть
$(document).ready(function(){
   setTimeout(function(){
      if(window.location.href.indexOf('#form_comment')!=-1){
         $.scrollTo('#form_comment',800);
      }else{
         $.scrollTo('#casing',800);
      };
   }, 2000);
});

Re: Условные операторы для навигации к якорю через Java Scri

Admin » » Сообщение:

Fearfire писал(а) › 29.01.2017, 19:37:В скрипте я поправил на #form_comment

Ах, ну да, конечно - переход к якорю - это действие по умолчанию..) ну и конечно же, оно наступает быстрее, чем $(document).ready() и тем более, через setTimeout()..
Как вариант 1, ссылке на добавление комментария задать якорь #comment, а в скрипте переходить уже к существующему - #form_comment..

Или, как вариант 2, перед вызовом добавить:

Код: Выделить всё Развернуть
scroll(0,0);

Типа так:

Код: Выделить всё Развернуть
$(document).ready(function(){
   scroll(0,0);
   setTimeout(function(){
      if(window.location.href.indexOf('#form_comment')!=-1){
          $.scrollTo('#form_comment',800);
      }else{
          $.scrollTo('#casing',800);
      };
   }, 2000);
});

Re: Условные операторы для навигации к якорю через Java Scri

Fearfire » » Сообщение:

Admin писал(а) › 29.01.2017, 20:19:Как вариант 1, ссылке на добавление комментария задать якорь #comment, а в скрипте переходить уже к существующему - #form_comment..

Да! Теперь получилось!

В "Вид фотографий" к значку комментариев добавил якорь #comment

html Код: Выделить всё Развернуть
a href="$PHOTO_URL$#comment"

а в скрипте: переход к якорю #form_comment, если в url есть якорь #comment

script Код: Выделить всё Развернуть
$(document).ready(function(){
   setTimeout(function(){
      if(window.location.href.indexOf('#comment')!=-1){
          $.scrollTo('#form_comment',800);
      }else{
          $.scrollTo('#casing',800);
      };
   }, 2000);
});

Благодарю Вас! Помогли! :yes:



Re: Условные операторы для навигации к якорю через Java Scri

Admin » » Сообщение:

Fearfire писал(а) › 20.03.2017, 16:38:Как при нажатии на кнопку запустить скрипт повторно, но что-бы скролл был к якорю #form_comment?

Перенести скрипт в именную функцию (в данном виде она анонимная), и вызывать ее при загрузке - как и было, и по клику на кнопке.



Re: Условные операторы для навигации к якорю через Java Scri

Admin » » Сообщение:

Fearfire писал(а) › 20.03.2017, 16:59:но если якорь #casing будет в адресной строке, то перемещение будет к нему, а нужно при нажатии на кнопку перейти к #form_comment ...

Да..
Тогда просто так:

Код: Выделить всё Развернуть
<a href="javascript://" onclick="$.scrollTo('#form_comment',800);return false;">Перейти к форме</a>




Похожие темыКомментарии ПросмотрыПоследнее сообщение
0965Операторы шаблонов и системные коды...
Сообщение от: Admin
01449Операторы шаблонов и системные коды...
Сообщение от: Admin
02951Операторы шаблонов и системные коды...
Сообщение от: Admin
01372Как узнать номер поста на форуме юк...
Сообщение от: Admin
01725Операторы шаблонов и системные коды...
Сообщение от: Admin