lc_switch

activer/désactiver plein écran

by Benahmed Taoufiq

HTML

<script src="https://www.jqueryscript.net/demo/jQuery-Plugin-For-Sliding-Toggle-Switches-LC-Switch/lc_switch.js"></script>
<link rel="stylesheet" href="https://www.jqueryscript.net/demo/jQuery-Plugin-For-Sliding-Toggle-Switches-LC-Switch/lc_switch.css">

<input type="checkbox" class='lcs_check'/>

JavaScript

/*https://www.developpez.net/forums/d1913496/javascript/bibliotheques-frameworks/jquery/associer-codes-seul-jquery-fullscreen-api-toggle-switch/#post10602596*/

function launchFullscreen(element) {
  if(element.requestFullScreen) {
    element.requestFullScreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullScreen) {
    element.webkitRequestFullScreen();
  }
}
 
function cancelFullscreen() {
  if(document.cancelFullScreen) {
    document.cancelFullScreen();
  } else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if(document.webkitCancelFullScreen) {
    document.webkitCancelFullScreen();
  }
}
 
 
$(document).ready(function(){
	$('input.lcs_check').lc_switch();
	$('body')
	.delegate('.lcs_check', 'lcs-statuschange', function() {
		var status = ($(this).is(':checked')) ? 'checked' : 'unchecked';
		console.log('field changed status: '+ status );
	})
	.delegate('.lcs_check', 'lcs-on', function() {//active le mode
		launchFullscreen($(document).get(0).documentElement);//l’élément cible
		console.log('field is checked');
	})
	.delegate('.lcs_check', 'lcs-off', function() {//annule le mode
	  cancelFullscreen(); 
	  console.log('field is unchecked');
	});
 
 
});