122 строки
5.3 KiB
HTML
122 строки
5.3 KiB
HTML
|
|
<div ng-controller="RotatCtrl">
|
|
<div class="content-container-fluid">
|
|
<div class="row">
|
|
<div class="rotatorApi">
|
|
<div class="cols-sample-area">
|
|
<div class="frame">
|
|
<div class="control">
|
|
<ul id="sliderContent" accesskey="e" ej-rotator e-slideWidth="100%" e-slideHeight="auto" e-isResponsive=true
|
|
e-frameSpace="0px" e-displayItemsCount="1" e-navigateSteps="1" e-pagerPosition="pagerposition" e-showThumbnail="true" e-thumbnailSourceID="sourceid" e-orientation="orientation"
|
|
e-showPager="false" e-enabled="true" e-showCaption="false" e-allowKeyboardNavigation="true" e-showPlayButton="true" e-animationType="animationtype">
|
|
<li>
|
|
<img class="image" src="content/images/rotator/nature.jpg" title="Nature" /></li>
|
|
<li>
|
|
<img class="image" src="content/images/rotator/bird.jpg" title="Beautiful Bird" /></li>
|
|
<li>
|
|
<img class="image" src="content/images/rotator/sculpture.jpg" title="Amazing Sculptures" /></li>
|
|
<li>
|
|
<img class="image" src="content/images/rotator/seaview.jpg" title="Sea-View" /></li>
|
|
<li>
|
|
<img class="image" src="content/images/rotator/snowfall.jpg" title="Snow Fall" /></li>
|
|
<li>
|
|
<img class="image" src="content/images/rotator/card.jpg" title="Credit Card" /></li>
|
|
<li>
|
|
<img class="image" src="content/images/rotator/night.jpg" title="Colorful Night" /></li>
|
|
</ul>
|
|
<ul id="slide" style="display: none">
|
|
<li>
|
|
<img src="content/images/rotator/nature.jpg" title="Nature" /></li>
|
|
<li>
|
|
<img src="content/images/rotator/bird.jpg" title="Beautiful Bird" /></li>
|
|
<li>
|
|
<img src="content/images/rotator/sculpture.jpg" title="Amazing Sculptures" /></li>
|
|
<li>
|
|
<img src="content/images/rotator/seaview.jpg" title="Sea-View" /></li>
|
|
<li>
|
|
<img src="content/images/rotator/snowfall.jpg" title="Snow Fall" /></li>
|
|
<li>
|
|
<img src="content/images/rotator/card.jpg" title="Credit Card" /></li>
|
|
<li>
|
|
<img src="content/images/rotator/night.jpg" title="Colorful Night" /></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div id="property-window" class="box wide">
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Alt + j
|
|
</div>
|
|
<div class="col-md-3">
|
|
Focuses the control
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Up / Right
|
|
</div>
|
|
<div class="col-md-3">
|
|
Move to next slide
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Down / Left
|
|
</div>
|
|
<div class="col-md-3">
|
|
Move to previous slide
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Space
|
|
</div>
|
|
<div class="col-md-3">
|
|
Play/Pause slide
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Alt+Right
|
|
</div>
|
|
<div class="col-md-3">
|
|
Move thumbnail item to left and select item
|
|
</div>
|
|
</div>
|
|
<br />
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Alt+left
|
|
</div>
|
|
<div class="col-md-3">
|
|
Move thumbnail item to right and select item
|
|
</div>
|
|
</div>
|
|
<br />
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
Enter
|
|
</div>
|
|
<div class="col-md-3">
|
|
Move to selected thumbnail item
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style type="text/css" class="cssStyles">
|
|
.frame {
|
|
width:600px;
|
|
}
|
|
#sliderContent li img {
|
|
width: 100%;
|
|
height:300px;
|
|
}
|
|
</style>
|
|
|