LEARN@IGP

Infogrid Pacific-The Science of Information

24

Widgets: Panel Tutorial

Frame sliding in two directions inside panel  Updated: 2014-07-18

Sliding Direction - Horizontal

Frame 1

Frame 2

Frame 3

Frame 4

Frame 5

<div class="widgets-rw panel-tutorial-rw slide-horizontal-rw exclude-auto-rw" id="pst1" title="Panel Tutorial">
<div class="frame-rw">
   <div class="frame-content-rw">
      <p>Frame 1</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 2</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 3</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 4</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 5</p>
   </div>
</div>
</div>

Sliding Direction - Vertical

Frame 1

Frame 2

Frame 3

Frame 4

Frame 5

<div class="widgets-rw panel-tutorial-rw slide-vertical-rw exclude-auto-rw" id="pst2" title="Panel Tutorial">
<div class="frame-rw">
   <div class="frame-content-rw">
      <p>Frame 1</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 2</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 3</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 4</p>
   </div>
   <div class="frame-content-rw">
      <p>Frame 5</p>
   </div>
</div>
</div>

      

comments powered by Disqus