JSFiddle - React, Tailwind, and code Playground

by Akram kamal

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css">
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
<div data-role="page" id="home">
    <div data-role="content">
        <div data-role="collapsible">
           <h3>Header #1</h3>
           <p>I'm Header #1</p>
        </div>
        <br />
        <div data-role="collapsible" data-collapsed="false">
           <h3>Header #2</h3>
           <p>I'm Header #2</p>
        </div>
    </div>
</div>

JavaScript

$("div:jqmData(role='collapsible')").each(function(){
    bindEvents($(this));
    //bindEventTouch($(this)); 
});
    
    
function bindEventTouch(element) {
    element.bind('tap taphold swipe swiperight swipeleft', function(event, ui) {
       alert('Event: '+event.type); 
    });
}

// List of events: http://api.jquery.com/category/events/
function bindEvents(element) {
    element.bind('click change dblclick submit', function(event) {
        alert('Element Event: '+event.type);
    });
}