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

Line 5: Line 5:
 
         <script src="//code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
 
         <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:56, 5 May 2017