to top

Mon - Fri 8:30 am to 5:00 pm

Talk to us (800) 909 902

Elements

Nothing can be done without hope

Slideset

To create a slideset of panels with filters, use the uk-slideset class. The attributes can be used configure the parameters of the slider. See this table for all the available settings options.


You can create filters using the data-uk-filter attribute.

markup
<ul class="uk-subnav uk-flex-center">
  <li data-uk-filter=""><a href="#">All</a></li>
  <li data-uk-filter="business"><a href="#">business</a></li>
  <li data-uk-filter="commercial"><a href="#">commercial</a></li>
</ul>

  • Commerce & Finance

    Commerce & Finance

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.
  • Family Disagreements

    Family Disagreements

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.
  • Exclusive
    Estate Planning

    Estate Planning

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.
  • Insurance Fraud

    Insurance Fraud

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.
  • Business Protection

    Business Protection

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.
  • Escrow accounts

    Escrow accounts

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.
  • Refunds & Bonuses

    Refunds & Bonuses

    It offers a framework to generate economic growth, achieve social justice, exercise environmental.

    Show code

    <div class="tm-slideset-truford" data-uk-slideset="{default: 1,small: 2,medium: 2,large: 3, xlarge: 3, animation: 'fade'}"> <ul class="uk-subnav uk-flex-center"> <li data-uk-filter=""><a href="#">All</a></li> <li data-uk-filter="bread"><a href="#">bread</a></li> <li data-uk-filter="chicken"><a href="#">chicken</a></li> <li data-uk-filter="fish"><a href="#">fish</a></li> <li data-uk-filter="pasta"><a href="#">pasta</a></li> <li data-uk-filter="prawns"><a href="#">prawns</a></li> <li data-uk-filter="salads"><a href="#">salads</a></li> </ul> <div class="uk-slidenav-position uk-margin"> <ul class="uk-grid uk-slideset uk-grid-match uk-flex-center"> <!-- slideset panel --> <li data-uk-filter="pasta"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-1.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-1.jpg" class="uk-overlay-scale" alt="Butternut ravioli" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">Butternut ravioli</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> <!-- slideset panel --> <li data-uk-filter="fish"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-2.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-2.jpg" class="uk-overlay-scale" alt="Grilled snapper" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">Grilled snapper</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> <!-- slideset panel --> <li data-uk-filter="chicken"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-3.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-3.jpg" class="uk-overlay-scale" alt="Roasted chicken" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">Roasted chicken</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> <!-- slideset panel --> <li data-uk-filter="prawns,fish"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-4.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-4.jpg" class="uk-overlay-scale" alt="Golden Prawns" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">Golden Prawns</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> <!-- slideset panel --> <li data-uk-filter="salads"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-5.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-5.jpg" class="uk-overlay-scale" alt="French Salad" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">French Salad</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> <!-- slideset panel --> <li data-uk-filter="bread"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-6.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-6.jpg" class="uk-overlay-scale" alt="Focaccia Bread" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">Focaccia Bread</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> <!-- slideset panel --> <li data-uk-filter="pasta"> <div class="uk-panel uk-panel-box uk-panel-box-hover uk-overlay-hover uk-text-left"> <a data-uk-lightbox="{group:'slideset'}" class="uk-position-cover uk-position-z-index" href="images/demo/menu/special-7.jpg"></a> <div class="uk-text-center uk-panel-teaser"> <div class="uk-overlay "> <img src="images/demo/menu/special-7.jpg" class="uk-overlay-scale" alt="Spaghetti Bolognese" width="360" height="230" url="#"> <div class="uk-overlay-panel uk-overlay-background uk-overlay-icon uk-overlay-fade"></div> </div> </div> <h3 class="uk-panel-title">Spaghetti Bolognese</h3> Sumptuous delicious food baked in our restaurants with curated spices </div> </li> </ul> <a href="" class="uk-slidenav uk-slidenav-previous uk-hidden-touch" data-uk-slideset-item="previous"></a> <a href="" class="uk-slidenav uk-slidenav-next uk-hidden-touch" data-uk-slideset-item="next"></a> </div> <ul class="uk-slideset-nav uk-dotnav uk-flex-center uk-margin-bottom-remove"> <li data-uk-slideset-item="0"> <a></a> </li> </ul> </div>

    Stay in touch with the latest news

    We'd like to send you our latest news.

    Truford Pro

    Truford Pro
    Mirage Plaza, Waiyaki Way
    Nairobi, Kenya
    +254 (800) 909 902
    +254 (800) 909 901
    info@truford.pro

    Partners

    We are passionate about what we do. Here are our accolades.

    Partners