1 <div id="video-widget-imagemap">
2 <div><div class="ui-imagemap-image" style="margin: 0 auto; margin-bottom: 1em">
3 <img src="<?php echo site_url('img/nsvideo-widget.jpg') ?>" alt="NextShare Video Widget Screenshot" width="446" height="353" />
6 <div id="video-widget-titles">
7 <h3><a href="#" class="ui-imagemap-title"
8 data-left="5px" data-top="44px" data-width="433px" data-height="246px"
9 >Watching Area</a></h3>
11 Here you can watch the video.
14 <h3><a href="#" class="ui-imagemap-title"
15 data-left="3px" data-top="314px" data-width="32px" data-height="34px"
16 ><em>Play</em> / <em>Pause</em> button</a></h3>
18 Toggle playing and pausing the video.
21 <h3><a href="#" class="ui-imagemap-title"
22 data-left="41px" data-top="321px" data-width="39px" data-height="21px"
23 >Current Time</a></h3>
28 <h3><a href="#" class="ui-imagemap-title"
29 data-left="86px" data-top="323px" data-width="57px" data-height="19px"
35 <h3><a href="#" class="ui-imagemap-title"
36 data-left="2px" data-top="295px" data-width="439px" data-height="22px"
37 >Time Progress Slider</a></h3>
42 <h3><a href="#" class="ui-imagemap-title"
43 data-left="213px" data-top="320px" data-width="80px" data-height="24px"
44 ><em>Volume</em> Slider</a></h3>
49 <h3><a href="#" class="ui-imagemap-title"
50 data-left="181px" data-top="313px" data-width="32px" data-height="36px"
51 ><em>Mute</em> button</a></h3>
56 <h3><a href="#" class="ui-imagemap-title"
57 data-left="293px" data-top="313px" data-width="119px" data-height="37px"
58 >Switch Video Definition (Resolution)</a></h3>
63 <h3><a href="#" class="ui-imagemap-title"
64 data-left="6px" data-top="6px" data-width="134px" data-height="42px"
65 >Switch Video Plugin</a></h3>
70 <h3><a href="#" class="ui-imagemap-title"
71 data-left="407px" data-top="315px" data-width="35px" data-height="34px"
72 ><em>Full Screen</em> button</a></h3>
80 <script type="text/javascript">
82 $('#video-widget-titles').accordion({
87 $('#video-widget-imagemap').imagemap({