G123: Adding a link at the beginning of a block of repeated content to go to the end of the block
| HTML Snippet |
Code |
Scenario 1:Skip link is added for each section |
|
View Example
|
<![CDATA[<div id="wrapper">
<a href="#content">Skip to main content</a>
<div id="header">
<a href="#Quick">Skip Navigation</a>
<div id="navigation">
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">About</a></li>
<li><a href="#contact">Products</a></li>
<li><a href="#about">Services</a></li>
<li><a href="#about">News</a></li>
<li><a href="#about">Contact</a></li>
</ul>
</div>
</div>
<div id="content-box1"><p>Box 1</p></div>
<div id="content-box2"><p>Box 2</p></div>
<div id="content-box3"><p>Box 3</p></div>
<div id="content">
<div id="content-left">
<p id="Quick"><strong>Quick Links</strong></p>
<a href="#content-main">Skip Quick links</a>
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Products</a>
<a href="#">Services</a>
<a href="#">News</a>
<a href="#">Contact</a>
</div>
<div id="content-main">
<p>Main home page content or image goes here... <a href="#">Read More</a></p>
</div>
</div>
<div id="footer">Footer text and links can go all the way along here... text text text text text text...</div>
<div id="bottom"></div>
</div>
]]> |