簡體   English   中英

如何重定向到帶有貓頭鷹輪播的其他HTML頁面的特定部分

[英]How to redirect toa particular section of a different html page which has owl carouselin it

我想將用戶重定向到html頁面的特定部分。

 // javascript for owl $(document).ready(function(){ $('.owl-two').owlCarousel({ loop:true, margin:10, nav:true, autoplay:true, responsive:{ 0:{ items:1 }, 600:{ items:2 }, 1000:{ items:3 } } }); }); 
 <!-- nav--> <ul class="dropdown-menu"> <li><a href="salon_services.php#hair">Hair</a></li> <li><a href="salon_services.php#nail">Nail</a></li> <li><a href="salon_services.php#wax">Wax</a></li> </ul> <!-- owl carousel in salon services page--> <div id="nail" class="row" > <br> <br> <h3 class="text-center">Our Nail Services</h3> <br> <!-- nail carousal--> <div class="owl-two owl-carousel owl-theme"> <div class="item"><img src="images/n1.jpg" alt="Image" class=" img-thumbnail"> <h4 class="text-center">Manicure</h4> </div> <div class="item"><img src="images/n2.jpg" alt="Image" class=" img-thumbnail"> <h4 class="text-center">Pedicure</h4> </div> <div class="item"><img src="images/n3.jpg" alt="Image" class=" img-thumbnail"> <h4 class="text-center">Nail Painting and Design</h4> </div> <div class="item"><img src="images/n4.jpg" alt="Image" class=" img-thumbnail"> <h4 class="text-center">Nail Extensions</h4> </div> </div> 

我想直接將用戶從nav下拉列表重定向到包含該內容的另一個頁面的div 我要重定向到的頁面有3個貓頭鷹輪播。

我已經嘗試了html id重定向。 <a href="#id"> ,但是它不能完全正常工作。 頁面會短暫地重定向到該部分,但會自動滾動到頁面頂部。

我使用的是owl輪播,並認為owl javascript是造成此問題的原因,因為我已經通過刪除owl對其進行了測試,並且它可以正常工作,並且從同一頁面(即services page)完成id重定向也可以正常工作。 我有3個輪播1.hair 2.nail 3.wax請幫助我保持貓頭鷹和分區重定向功能。 謝謝。

 .sec { width: 100%; height: 100vh; background-color: #ccc; margin-bottom: 12px; } 
 <ul> <li><a href="#one">One</a></li> <li><a href="#two">Two</a></li> <li><a href="#three">Three</a></li> <li><a href="#Four">Four</a></li> </ul> <div id="one" class="sec"> <h1>One</h1> </div> <div id="two" class="sec"> <h1>Two</h1> </div> <div id="three" class="sec"> <h1>Three</h1> </div> <div id="four" class="sec"> <h1>Four</h1> </div> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM