iOSList - iOS Alphabetical Contact List

iOSList is a jQuery plugin that creates iOS-style sticky headers similar to those seen in the Music and Contacts apps on Apple devices. It is tested to work in the following browsers:

• Mac (Chrome 10+, Safari 4+, Firefox 3.5+, Opera)
• PC (Chrome 10+, Safari 4+, Firefox3.5+, Opera, IE6+)
• iOS 3+ (Safari Mobile)
• Android 2.2+ (Chrome, Firefox 4, Opera 11)

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

Source: brianhadaway.github.io

1. INCLUDE CSS AND JS FILES

<link rel="stylesheet" href="css/jquery.ioslist.css" />
<script src="js/jquery.min.js"></script>
<script src="js/jquery.ioslist.js"></script>

2. HTML

<!-- somewhere in the body tag -->
<div id="list1">
    <div class="ioslist-group-container">
        <div class="ioslist-group-header">A</div>
        <ul>
            <li>Afghanistan</li>
            <li>Akrotiri</li>
            <li>Albania</li>
            <li>Algeria</li>
            <li>American Samoa</li>
        </ul>
    </div>
    <div class="ioslist-group-container">
        <div class="ioslist-group-header">B</div>
        <ul>
            <li>Bahamas, The</li>
            <li>Bahrain</li>
            <li>Bangladesh</li>
            <li>Barbados</li>
            <li>Bassas da India</li>
        </ul>
    </div>
    <div class="ioslist-group-container">
        <div class="ioslist-group-header">C</div>
        <ul>
            <li>Cambodia</li>
            <li>Cameroon</li>
            <li>Canada</li>
            <li>Cape Verde</li>
            <li>Cayman Islands</li>
        </ul>
    </div>
</div>

3. JAVASCRIPT

$(function(){
    $("#list1").ioslist();
});