A11y carousel

A11y carousel is a simple carousel with a focus on clean, accessible markup. This incarnation attempts to create a light, semantic carousel while minimising the usual accessibility issues.

Features

• Can contain any html content
• Uses semantic HTML - composed of lists and buttons
• Navigation is dynamically created based on carousel items
• Keyboard accessible
• Pause/play control
• Auto-play option
• Navigation controls can overlay carousel or sit beneath
• Uses CSS3 transforms when supported
• Tested on all modern browsers, and IE7+

• denizli escort
• denizli escort
• didim escort
• düzce escort
• edirne escort
• edirne escort
• edremit escort

Source: skyefradd.me

1. INCLUDE CSS AND JS FILES

<link rel="stylesheet" href="a11ycarousel.css" type="text/css" />
<script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="a11ycarousel.min.js" type="text/javascript"></script>

2. HTML

<div id='carousel-container'>
  <ul>
    <li>...</li>
    ...
  </ul>
</div>

3. JAVASCRIPT

$('#carousel-container').a11ycarousel({
  width: 450,
  height: 200
});

4. OPTIONS