頁面跳轉錨的正確使用方法是什么？
[英]What is the correct way to use page jump anchors?
問題描述
我想制作一個導航面板，將跳轉到錨點作為鏈接。 如何使錨鏈接轉到下一個網頁並跳轉到其指定的錨？
我嘗試在網頁中分配一個唯一的錨點以匹配導航面板中的錨點。 到目前為止，鏈接將導航到另一個網頁並跳轉到其錨點一次。
然后，唯一有效的鏈接是那些只在當前頁面上找到錨點的鏈接，即使鏈接告訴他們去另一個頁面並找到相應的錨點。
以下是包含在 .php 文件中的代碼，因此整個站點的導航是相同的。
<html>
<ul>
<li><a href="#"><h2>About</h2></a></li>
<li><a href="http://weathersbyink.com/hikc/prints/" id="closea"><h2>Prints</h2></a></li>
<li><a href="http://weathersbyink.com/hikc/archive/" id="closeb"><h2>Archival</h2></a></li>
<li><a href="#"><h2>VHS & Reels</h2></a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="http://weathersbyink.com/hikc/prints/index.php#pj00" id="closec" target="_parent">Standard 1HR</a></li>
<li><a href="http://weathersbyink.com/hikc/archive/index.php#pj05" id="closed">Shoebox Scan</a></li>
<li><a href="#">Tape to DVD</a></li>
<li><a href="#">Blog</a></li>
<li><a href="http://weathersbyink.com/hikc/prints/index.php#pj01" id="closee">Large Format</a></li>
<li><a href="http://weathersbyink.com/hikc/archive/index.php#pj06" id="closef">Single Scan</a></li>
<li><a href="#">Repairs</a></li>
<li><a href="#">Find Us</a></li>
<li><a href="http://weathersbyink.com/hikc/prints/index.php#pj02" id="closeg">Mounting</a></li>
<li><a href="http://weathersbyink.com/hikc/archive/index.php#pj07" id="closeh">Slide (Positive) Scan</a></li>
<li><a href="#">Film to DVD</a></li>
<li><a href="#">Hire Us!</a></li>
<li><a href="http://weathersbyink.com/hikc/prints/index.php#pj03" id="closei">Lamination</a></li>
<li><a href="http://weathersbyink.com/hikc/archive/index.php#pj08" id="closej">Negative Scans</a></li>
<li><a href="#">Cassette to CD</a></li>
<li><a href="#"> </a></li>
<li><a href="http://print.sayhikc.com/">Order Online</a></li>
<li><a href="http://weathersbyink.com/hikc/archive/index.php#pj09" id="closek">CD/DVD Copy</a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"><h2>Film</h2></a></li>
<li><a href="#"><h2>Restorations</h2></a></li>
<li><a href="#"><h2>Special</h2></a></li>
<li><a href="#"><h2>Events</h2></a></li>
<li><a href="#">Develop Only</a></li>
<li><a href="#">Photoshop I</a></li>
<li><a href="#">Canvas Prints</a></li>
<li><a href="#">Classes</a></li>
<li><a href="#">Single Set</a></li>
<li><a href="#">Photoshop II</a></li>
<li><a href="#">Aluminum</a></li>
<li><a href="#">1-on-1 Consultation</a></li>
<li><a href="#">Double Set</a></li>
<li><a href="#">Small Projects</a></li>
<li><a href="#">Metalic</a></li>
<li><a href="#">Sales</a></li>
<li><a href="#">Black & White</a></li>
<li><a href="#"> </a></li>
<li><a href="#">Wood Transfer</a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
<li><a href="#"> </a></li>
</ul>
===== Section: Page A ===========================================
<div class="prints01">
<h3>Mounting</h3>
<p>Add a unique spin to your image!</p>
<ul>
<li>High-quality, crisp color printing</li>
<li>24 Hour Turn-Around</li>
<li>Durable and Long-Lasting</li>
<li>Professional, personal application</li>
<li>Available in Matte and Glossy Finish</li>
</ul>
<!-- end prints01 --></div><a id="pj03"></a>
===== Section: Page B ===========================================
<div class="prints01" style="margin-top: 12%">
<h3>Negative Scans</h3>
<p>Lamination is the ideal method for adding years to the life of your displayed images and graphics.</p>
<ul>
<li>High Gloss</li>
<li>Maintains Image contrast & Saturation</li>
<li>Adds UV Protection</li>
<li>Easily Cleanable</li>
<li>24 Hour Turn-Around</li>
</ul>
<!-- end prints01 --></div><a id="pj09"></a>
</html>
我希望鏈接從導航面板導航到頁面 A 和 B 上的目的地。
1 個解決方案
解決方案1
0 2019-04-08 15:54:55
我剛剛找到了這個答案。
“我在 w3school 引導程序模板中發現了這一點，該模板將此命令作為塊的一部分，可以很好地滾動到主題標簽。一旦我將其注釋掉，鏈接就可以正常工作。”
https://stackoverflow.com/a/40722833/8836444
謝謝@charlietfl 和@mike ursitti
使用 javascript .onclick 函數的正確方法是什么？
[英]What is the correct way to use the javascript .onclick function?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.