执行功能（地理位置），当用户浏览到特定部分

我使用，我是建立一个网站这个免费的模板：http://blackrockdigital.github.io/startbootstrap-scrolling-nav/执行功能（地理位置），当用户浏览到特定部分

我使用地理定位服务（谷歌）。但我不想强迫用户每次进入站点时都推送“批准”，只有当用户导航到/推动“服务”按钮/区域时，我才需要执行地理定位功能。有人有一个想法如何解决这个问题吗？

我能以某种方式检查他们在网站上的位置吗？我可以得到部分ID，但是我如何根据用户目前的位置进行检查？部分的

实施例：

<!-- 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>

感谢。

来源

2016-03-03 Robin

请告诉我地理位置代码，您正在使用？尝试将它封装在您调用按钮单击的函数中，或者将它包装在您希望执行的页面上的document.ready（）上？ – glcheetham

我不能使用.ready（），因为它使用部分（当我按下“服务”按钮时滚动到部分，而不是重定向到（不存在的）服务页面，如果我使用.ready（）将会在用户进入站点时执行，就像它现在一样吗？ – Robin

解决它：https://learn.jquery.com/using-jquery-core/document-ready/

使用jQuery，你也可以在点击按钮运行代码，这样（当按钮被点击的页面滚动到部分）：

$(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

来源

2016-03-04 15:33:51 Robin

如果你正在使用jQuery（你可能有你的页面上已经 - 引导），你可以在一个的document.ready（）函数包装代码，就像这样：

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

对于它运行时该页面已完成加载。通过使用此两种滚动和点击

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

上查看文档（）这里http://api.jquery.com/on/

来源

2016-03-03 20:04:20 glcheetham

我不能使用.ready（），因为它使用段（并且当我按下“服务”按钮时滚动到该段，而不是重定向到不存在）服务页面，如果我使用.ready（），它会在用户进入站点时执行，就像现在一样？ – Robin

执行功能（地理位置），当用户浏览到特定部分

回答

相关问题