widget:next

Purpose

Defines a button that links to the next step. In a gallery, it displays the next page. When used in a slideshow, it displays the next item.

It can be either in normal or disabled state. You can show the disabled state with the :mcs-disabled pseudo-class.

Contained by

Attribute groups

Example

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/2002/06/xhtml2"
  xmlns:widget="http://www.volantis.com/xmlns/2006/05/widget"
  xmlns:gallery="http://www.volantis.com/xmlns/2006/10/gallery-widget">
  <head>
    <title>Gallery Widget with AJAX</title>
  </head>
  <body>
    <div>
      <gallery:items>
        <widget:load src="http://localhost:8080/mcs/projects/client-app/service/itemgallery"
          when="defer"/>
      </gallery:items>
    </div>
    <table>
      <tr>
        <td>
          <gallery:gallery class="widget" slideshow="slideshow" slideshow-popup="gallery-popup">
            <div>
              <table>
                <tr>
                  <td>
                    <widget:previous>&lt;&lt;</widget:previous>
                  </td>
                  <td>
                    <gallery:item-display/>
                  </td>
                  <td>
                    <gallery:item-display/>
                  </td>
                  <td>
                    <widget:next>&gt;&gt;</widget:next>
                  </td>
                </tr>
              </table>
            </div>
            <div>Displaying items from <gallery:start-item-number/> to <gallery:end-item-number/> of
              <gallery:items-count/></div>
            <div>Page number: <gallery:page-number/> of <gallery:pages-count/></div>
          </gallery:gallery>
        </td>
      </tr>
      <tr>
        <td>
          <widget:popup id="gallery-popup">
            <gallery:slideshow id="slideshow">
              <gallery:item-display/>
              <widget:previous>&lt;&lt;</widget:previous>
              <widget:pause>Pause</widget:pause>
              <widget:play>Play</widget:play>
              <widget:next>&gt;&gt;</widget:next>
              <widget:dismiss>Close</widget:dismiss>
              <div>Displaying item <gallery:item-number/> of <gallery:items-count/></div>
            </gallery:slideshow>
          </widget:popup>
        </td>
      </tr>
    </table>
  </body>
</html>

Related topics