Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: Связать якорь тега [A] и [SELECT]
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » Связать якорь тега [A] и [SELECT]

Страниц (1): [1]
 

1. dima_si - 29 Августа, 2016 - 14:13:58 - перейти к сообщению
Уважаемые форумчане, уверен, что кто-то из вас уже сталкивался с подобной задачей. На странице имеется список SELECT, который в свою очередь содержит все якоря, которые раскиданы по странице. При выборе селекта настроен переход на нужный якорь. Необходимо настроить обратное взаимодействие, когда при скроллинге будет меняться значение SELECT'a в соответствии с проходящем якорем. Использую JQuery, т.ч. можно и на нем. Кто в теме пожалуйста подскажите, как это можно реализовать.
2. OrmaJever - 29 Августа, 2016 - 17:05:52 - перейти к сообщению
CODE (javascript):
скопировать код в буфер обмена
  1. $(document).on('scroll', function(e) {
  2.   var s = $(document).scrollTop();
  3.   if( s > $('a[name=jakor3]').offsetTop() ) {
  4.      $('option[value=jakor3]').attr('selected', 'selected');
  5.   } else if( s > $('a[name=jakor2]').offsetTop() ) {
  6.      $('option[value=jakor2]').attr('selected', 'selected');
  7.   } else if( s > $('a[name=jakor1]').offsetTop() ) {
  8.      $('option[value=jakor1]').attr('selected', 'selected');
  9.   }
  10. })

Я не проверял, мог даже ошибиться с названиями методов jQuery, но логикая я думаю понятна
3. armancho7777777 - 29 Августа, 2016 - 18:53:39 - перейти к сообщению
OrmaJever пишет:
мог даже ошибиться с названиями методов jQuery
OrmaJever пишет:
offsetTop()

offset().top
4. dima_si - 31 Августа, 2016 - 09:57:11 - перейти к сообщению
armancho7777777, OrmaJever спасибо за пинок в нужном направлении, готовый вариант кода выглядит следующим образом (возможно кому-то и пригодится):

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2.         var olds=$(document).scrollTop();
  3.         $(document).on('scroll', function(e) {
  4.                 $('#scrl').html('');
  5.                 var s = $(document).scrollTop();                                       
  6.                 var name='';
  7.                 if(olds<s){
  8.                         $("a[name]").each(function(){
  9.                                 if(s>=$(this).offset().top) {name=$(this).attr('name');}
  10.                                
  11.                                 });
  12.                 }
  13.                 else{
  14.                         var DelaemIveriyu = $("a[name]").get().reverse();
  15.                         $(DelaemIveriyu).each(function(){
  16.                                 if(s<=$(this).offset().top){name=$(this).attr('name');}
  17.                         });
  18.                 }
  19.                 $('SELECT option').each(function(){
  20.                         if($(this).attr('value')=='#'+name)this.selected=true;
  21.                         else this.selected=false;                      
  22.                 });
  23.                 olds=s;
  24.         });
  25.  

 

Powered by ExBB FM 1.0 RC1