G28 Chapter Selector

Definition

Numbered link list used to navigate to chapters of video content.

Usage

Used on pages with video content to link to chapters of the video. The video must have more than one chapter to use this component.

v0 Chapter Selector

Sample
Code
Templates (0)

Use as shown in the example. The "Chapters" text should be translated as needed, along with the values of the title attribute in the A objects.

Chapters:

No Templates Reference this

Use as shown in the example. The "Chapters" text should be translated as needed, along with the values of the title attribute in the A objects.

Chapters:

1

Chapter 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.

Watch the video »
2

Chapter 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.

Watch the video »
3

Chapter 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.

Watch the video »
4

Chapter 4

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.

Watch the video »

Copy the code below and paste into your text editor.

<div class="g28 g28v0 chapterlist">
<h5 class="chaptertitle">Chapters:</h5>
<ul>
<li class="k2over info1 vTop hLeft y-28 x-40"><a href="{placeholder}" target="lniframe" title="Chapter 1">1</a>
	
	<div class="k2 k2v1 aboveleft" id="info1">
	<div class="k2v1x1"></div>
	<div class="k2v1w1">
	<h5>Chapter 1</h5>
	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
	<p><a href="{placeholder}" target="lniframe">Watch the video &#187;</a></p>
	</div>
	<div class="k2v1x2"></div>
	</div>
	
</li>
<li class="k2over info2 vTop hLeft y-28 x-40"><a href="{placeholder}" target="lniframe" title="Chapter 2">2</a>
	
	<div class="k2 k2v1 aboveleft" id="info2">
	<div class="k2v1x1"></div>
	<div class="k2v1w1">
	<h5>Chapter 2</h5>
	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
	<p><a href="{placeholder}" target="lniframe">Watch the video &#187;</a></p>
	</div>
	<div class="k2v1x2"></div>
	</div>
	
</li>
<li class="k2over info3 vTop hLeft y-28 x-40"><a href="{placeholder}" target="lniframe" title="Chapter 3">3</a>
	
	<div class="k2 k2v1 aboveleft" id="info3">
	<div class="k2v1x1"></div>
	<div class="k2v1w1">
	<h5>Chapter 3</h5>
	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
	<p><a href="{placeholder}" target="lniframe">Watch the video &#187;</a></p>
	</div>
	<div class="k2v1x2"></div>
	</div>
	
</li>
<li class="k2over info4 vTop hLeft y-28 x-40"><a href="{placeholder}" target="lniframe" title="Chapter 4">4</a>
	
	<div class="k2 k2v1 aboveleft" id="info4">
	<div class="k2v1x1"></div>
	<div class="k2v1w1">
	<h5>Chapter 4</h5>
	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor.</p>
	<p><a href="{placeholder}" target="lniframe">Watch the video &#187;</a></p>
	</div>
	<div class="k2v1x2"></div>
	</div>
	
</li>
</ul>
</div>

G28 Chapter Selector

Include:

Definition

Usage

v0 Chapter Selector

Chapters:

No Templates Reference this

v0 x1 w/ pop ups

Chapters:

Chapter 1

Chapter 2

Chapter 3

Chapter 4

No Templates Reference this