首页 > 解决方案 > URL 链接到 # 页面位置和 Owl Carousel 滑块位置

问题描述

我有几个链接可以发送给在我的 html 网站 ( http://www.sound.co.uk ) 上引用 # 位置的客户。我正在使用 javascript 将一些对客户端更友好的 url 转换为页面上的特定 ID 标签。

例如

if (window.location.hash == "#services") {
navigationFn.goToSection('#audio-services');     
}

监听“....#services”并重定向到“....#audio-services”

或者

if (window.location.hash == "#quickrates") {     
navigationFn.goToSection('#rates-section');
window.scrollTo(window.scrollX, window.scrollY - 100);
$('#ratesModal').modal('show');
}

直接打开一个引导模式窗口。

问题是链接到我的 Owl Carousel 上的特定幻灯片。

if (window.location.hash == "#studio6") {   
window.location.hash = '#studio-6-podcasts-adr-games-animation-audio';
navigationFn.goToSection('#studio-6-podcasts-adr-games-animation-audio');
window.scrollTo(window.scrollX, window.scrollY - 75); 
}

会做的,但是当我在幻灯片中循环时,猫头鹰旋转木马就会失控;遗漏幻灯片或显示空白幻灯片。

这是我的猫头鹰 js:

$("#owl-slider-home").owlCarousel({
      slideSpeed : 500,
      paginationSpeed : 500,
      singleItem : true,
      transitionStyle : false,
      afterInit : progressBar,
      afterMove : moved,
      loop : true,
      autoHeight: true,
      touchDrag : true,
      mouseDrag : true,
      navigation: true,
       navigationText: [
        "<i class='fa fa-angle-left'></i>",
        "<i class='fa fa-angle-right'></i>"
        ]
    });

这是HTML:

<div class="bgslider-owl">

<div id="owl-slider-home" class="onStep owl-carousel" data-animation="fadeInRight" data-time="150">

<div class="item" id="studio-6-podcasts-adr-games-animation-audio" name="studio-6-podcasts-adr-games-animation-audio">
<div class="container">

etc..

我有 jQuery OwlCarousel v1.3.3 和 jQuery v3.1.0

非常感谢您的帮助。

标签: javascriptjqueryurlexternalowl-carousel

解决方案


推荐阅读