Javascript

Slider

Slider with navigation, random effects and 'click next' action.


Text Tooltip

Lorem ipsum dolor sit amet, text tip consectetur adipiscing elit. Curabitur mauris nisi, sed, pharetra a eros. Ut in purus enim, vel congue nisl. Sed non justo magna, sed eleifend nulla. Nullam augue nibh, vulputate ut ultrices et, molestie eget libero. Nunc porta purus sed velit ultrices sodales. Sed in urna arcu. Pellentesque feugiat purus non massa viverra blandit. Aliquam quis vestibulum lacus.

<a title="Custom text..." href="#" class="tip">text tip</a>

Toggle content

This is hidden toggle content

Lorem ipsum dolor sit amet, text tip consectetur adipiscing elit. Curabitur mauris nisi, sed, pharetra a eros. Ut in purus enim, vel congue nisl. Sed non justo magna, sed eleifend nulla. Nullam augue nibh, vulputate ut ultrices et, molestie eget libero. Nunc porta purus sed velit ultrices sodales. Sed in urna arcu. Pellentesque feugiat purus non massa viverra blandit. Aliquam quis vestibulum lacus.

This is active toggle content

Lorem ipsum dolor sit amet, text tip consectetur adipiscing elit. Curabitur mauris nisi, sed, pharetra a eros. Ut in purus enim, vel congue nisl. Sed non justo magna, sed eleifend nulla. Nullam augue nibh, vulputate ut ultrices et, molestie eget libero. Nunc porta purus sed velit ultrices sodales. Sed in urna arcu. Pellentesque feugiat purus non massa viverra blandit. Aliquam quis vestibulum lacus.

<div class="toggle">
   <h4 class="switch">Toggle title</h4>
   <!-- hidden content -->
      <div class="hidden-content">
         <p> ...hidden content here... </p>
      </div>
  <!-- /hidden content -->
</div>

Accordion list

  • Software Architecture

    Fusce ornare odio et ligula volutpat ultricies. Donec et ullamcorper dolor. Sed tellus lacus, lacinia sed porta vel, sodales nec turpis. Morbi eu tellus vel nisl semper pretium.

  • System Integration

    Fusce ornare odio et ligula volutpat ultricies. Donec et ullamcorper dolor. Sed tellus lacus, lacinia sed porta vel, sodales nec turpis. Morbi eu tellus vel nisl semper pretium.

    Fusce ornare odio et ligula volutpat ultricies. Donec et ullamcorper dolor.

  • Mobile Devices

    Fusce ornare odio et ligula volutpat ultricies. Donec et ullamcorper dolor. Sed tellus lacus, lacinia sed porta vel, sodales nec turpis. Morbi eu tellus vel nisl semper pretium.

  • Software Architecture

    Fusce ornare odio et ligula volutpat ultricies. Donec et ullamcorper dolor. Sed tellus lacus, lacinia sed porta vel, sodales nec turpis. Morbi eu tellus vel nisl semper pretium.

<ul class="accordion styled">
<li class="active">
<a class="title" href="#">Title here</a>
<!-- hidden content -->
<div class="hidden-content">
<p class="dark">...content here...</p>
</div>
<!-- /hidden content -->
</li>
<li class="active">
<a class="title" href="#">Title here</a>
<!-- hidden content -->
<div class="hidden-content">
<p class="dark">...content here...</p>
</div>
<!-- /hidden content -->
</li>
</ul>