Javascript Girl
  1. Javascript Girl
  3. Comment redimensionner la vidéo lorsque la vidéo démarre / arrête?
Intereting Posts
Obtenez l'ID vidéo Youtube du lien avec JavaScript La date personnalisée. Filtre ne montre PAS les dates dans iOS ONLY .split method approach Comment faire fonctionner l'option comboboxes associée Javascript: Supprime un élément d'un tableau d'objets Boîte d'alerte JavaScript avec confirmation sur le bouton Appuyez sur Pourquoi l'opérateur "in" de javascript est-il vrai lorsque vous testez si 0 existe dans un tableau qui ne contient pas 0? Mettre en surbrillance le polygone et la teinte du reste de la carte à l'aide de Google Maps Comment créer une minuterie dans angular2 Javascript Enum To Corresponding String Value Obtention de valeur de la case à cocher HTML à partir des événements onclick / onchange Renvoyer un COUNT à partir d'une requête WebSQL dans une fonction javaScript Héritage de Javascript: appelant Object.create lors du réglage d'un prototype JQuery Validation – valide le courrier électronique en utilisant l'appel AJAX Les éléments de compte de colonne CSS qui sauteront à travers des colonnes Facebook aime le rappel, et publie-le pour cibler

Comment redimensionner la vidéo lorsque la vidéo démarre / arrête?

Je pense que j'ai le bon code pour faire une vidéo plus grande quand il commence à jouer et plus petit lorsqu'il fait une pause. 

$(document).ready(function(){ if ($("section video").get(0).pause || $("section video").get(0).ended) { $("section video").click(function() { $("section video").animate({ width: "100%" }, 'slow') $("section video").queue(function(){ $("section video").get(0).play(); }); }); $("section video").animate({ width: "50%" }, 'slow') } else if ($("section video").get(0).play) { $("section video").click(function(){ $("section video").animate({ width: "50%" }, 'slow') $("section video").queue(function(){ $("section video").get(0).pause(); }); }); } });

Cependant, cela fonctionne quand je clique dessus et ça commence. Mais quand je clique dessus à nouveau avec la condition 'play', rien ne se passe. Est-ce que quelqu'un peut m'aider?

Il y a une faute de frappe, il est en pause et, pour autant que je sache, il n'y a pas de propriété pour les vidéos pour obtenir le statut de jeu .

Essayez avec ce code: 

 jQuery(document).ready(function($) { var video = $('section video').get(0); video.onended = function(e) { $('section video').animate({ width: "50%" }, 'slow'); } $('section video').click(function() { if(this.paused || this.ended){ $('section video').animate({ width: "100%" }, 'slow'); video.play(); } else{ $('section video').animate({ width: "50%" }); video.pause(); } }); });

METTRE À JOUR

Bien sûr, vous pouvez faire retentir la vidéo une fois l'animation terminée: 

  jQuery(document).ready(function($) { var video = $('section video').get(0); video.onended = function(e) { $('section video').animate({ width: "50%" }, 'slow'); } $('video').click(function() { if(this.paused || this.ended){ $('section video').animate({ width: "100%" }, { duration: 'slow', complete: function(){ video.play(); } }); } else{ video.pause(); $('section video').animate({ width: "50%" }); } }); });