Difference between revisions of "Template:Cologne-Duesseldorf/js-jquery"

Line 1: Line 1:
 
<html>
 
<html>
 
<body>
 
<body>
 +
 +
<script src="//code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
 +
 +
<!-- jQuery -->
 +
<script>
 +
$(document).ready(function(){
 +
$('#sidebar-btn').click(function(){
 +
$('#sidebar').toggleClass('visible');
 +
$('#overlay').toggleClass('active');
 +
$('#container').toggleClass('inactive');
 +
$('#sidebar-btn').toggleClass('inactive');
 +
});
 +
$('#overlay').click(function(){
 +
$('#sidebar').toggleClass('visible');
 +
$('#overlay').toggleClass('active');
 +
$('#container').toggleClass('inactive');
 +
$('#sidebar-btn').toggleClass('inactive');
 +
});
 +
 +
$('#sidebar ul ul.sub').click(function(){
 +
$(this).children().toggleClass('active');
 +
});
 +
$(function(){
 +
  $( "#container" ).on( "swiperight", swipeHandler );
 +
  $( "#overlay" ).on( "swipeleft", swipeHandler );
 +
  function swipeHandler( event ){
 +
$('#sidebar').toggleClass('visible');
 +
$('#overlay').toggleClass('active');
 +
$('#container').toggleClass('inactive');
 +
$('#sidebar-btn').toggleClass('inactive');
 +
  }
 +
});
 +
});
 +
 +
 +
 +
 +
 +
</script>
  
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 15:57, 5 May 2017