jQuery Girl
  1. jQuery Girl
  3. Activer / désactiver la propriété de visibilité de div
Intereting Posts
Pourquoi ces deux fonctions javascript ne sont-elles pas équivalentes? Comment remplir dynamicment selectize en utilisant c # webmethod Effectuer une action avant de soumettre le formulaire? Kendo dropdown rebind en utilisant jquery Comment mettre le texte défilant dans la balise de titre? Utilisation de jQuery avec Typescript 2 Comment formater la date et l’heure avec les modèles jQuery? Liaison d’événement sur des éléments créés dynamicment et des parameters de passage Aller à la page dans PDF.js avec javascript jQuery et javascript simple: différences entre append et appendChild lors de la construction d’une arborescence DOM Comment lire ligne par ligne une balise HTML de zone de texte $ (document) .click () ne fonctionne pas dans l’extension chrome Utiliser le bouton radio pour déclencher une action Contrôle du curseur jQuery pour l’opacité Performance: Pure CSS vs jQuery

Activer / désactiver la propriété de visibilité de div

J’ai une vidéo HTML 5 dans un div. J’ai ensuite un bouton de lecture personnalisé – cela fonctionne bien.
Et la visibilité de la vidéo est définie sur masquée lors du chargement et visible lorsque vous cliquez sur le bouton de lecture. Comment puis-je la rendre masquée lorsque le bouton de lecture est à nouveau cliqué? 

function showVid() { document.getElementById('video-over').style.visibility = 'visible'; } 
 #video-over { visibility: hidden; background-color: rgba(0, 0, 0, .7) }

En fait, j’essaie simplement de basculer entre les deux états visible et caché, sauf que je ne peux pas utiliser cette option, car elle est masquée et divisée. J’en ai besoin ici, juste caché, pour qu’il garde la bonne hauteur.

Utilisation de jQuery: 

 $('#play-pause').click(function(){ if ( $('#video-over').css('visibility') == 'hidden' ) $('#video-over').css('visibility','visible'); else $('#video-over').css('visibility','hidden'); });

Je sais que c’est une vieille question, mais je l’ai trouvée à la recherche d’un problème différent.

Selon les documents jQuery, appeler toggle () sans parameters activera la visibilité. 

  $('#play-pause').click(function(){ $('#video-over').toggle(); });

http://jsfiddle.net/Q47ya/

Il y a une autre façon de faire cela avec JavaScript. Tout ce que vous avez à faire est d’activer / désactiver la visibilité en fonction de l’état actuel de la visibilité de la DIV en CSS.

Exemple: 

 function toggleVideo() { var e = document.getElementById('video-over'); if(e.style.visibility == 'visible') { e.style.visibility = 'hidden'; } else if(e.style.visibility == 'hidden') { e.style.visibility = 'visible'; } }