Выполнение функции (геолокация), когда пользователь переходит к определенной части

Question

Я использую этот бесплатный шаблон для сайта, который я строй: http://blackrockdigital.github.io/startbootstrap-scrolling-nav/

Я использую геолокацию службу (Google). Но я не хочу принуждать пользователя нажимать «Утверждать» каждый раз, когда они входят на сайт, только когда пользователь переходит к/нажимает кнопку «Сервис»/область, тогда я хочу, чтобы моя функция геолокации выполнялась. У кого-то есть идея, как это решить?

Могу ли я как-то проверить, где они находятся на сайте? Я могу получить идентификатор раздела, но как я могу проверить это против того, где сейчас находится пользователь?

Пример секций:

<!-- About Section --> 
<section id="About" class="About-section"> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-lg-12"> 
       <h1>About</h1> 
       <h3>Here is text about us</h3> 
      </div> 
     </div> 
    </div> 
</section> 

<!-- Services Section --> 
<section id="Services-pdl" class="Services-section"> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-lg-12"> 
       <h1>Services</h1> 
       <div id="map"></div> 
      </div> 
     </div> 
    </div> 
</section> 

Благодаря.

Answer 1

решаемые его с помощью этого как для прокрутки и нажмите (страница прокручивается раздела при нажатии на кнопку):

$(window).scroll(function() { 
    if(isScrolledIntoView($(find))) 
    { 
    setTimeout(function() { 
     initMap(); 
    }, 900); 
    }  
}); 

function isScrolledIntoView(elem) 
{ 
    var $elem = $(elem); 
    var $window = $(window); 

    var docViewTop = $window.scrollTop(); 
    var docViewBottom = docViewTop + $window.height(); 

    var elemTop = $elem.offset().top; 
    var elemBottom = elemTop + $elem.height(); 

    return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop)); 
} 

SetTimeout необходимо в .scroll(), потому что, когда пользователь нажимает Еще одна кнопка (ниже этого раздела) будет выполняться без setTimeout. Не уверен, что если setTimeout может быть ниже 900, но сейчас он отлично работает.

Получили isScrolledIntoView() из ответа в этой теме: Check if element is visible after scrolling

Answer 2

Если вы используете JQuery (который вы, вероятно, есть на странице уже - самозагрузки), вы можете обернуть код в функции document.ready(), как это:

$(document).ready(function() { 
    // Code to execute 
}); 

Для того, чтобы работать, когда страница завершила загрузку. https://learn.jquery.com/using-jquery-core/document-ready/

С JQuery, вы можете также запустить код на кнопку мыши, как это:

$('#mybutton').on('click', function() { 
//Code to execute 
}); 

Смотрите документацию для включения() здесь http://api.jquery.com/on/