Forums Développement Multimédia

Aller au contenu

Waldos

Inscrit(e) (le) 01 Feb 2007
Déconnecté Dernière activité Sep 11 2019 14:24 PM
-----

Sujets que j'ai initiés

Ouvrir un accordion à un endroit spécifique en fonction de l'adresse de la page.

11 September 2019 - 11:43 AM

Bonjour,

J'ai récupéré le code d'un petit accordion assez simple, mais je n'arrive pas à trouver le code pour ouvrir celui-ci à un onglet différent en fonction du nom de la page dans la barre d'adresse.

un truc du genre:


Event.observe(window, 'load', loadAccordions, false);


  function loadAccordions() {
if( location.href=='https://www.raoul-douglas.com\/temporaire\/php\/tests\/accordion-8.php'){
alors je déploie la deuxième section de mon accordion.
}
}
 

Voici le code de la page de mon accordion :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Document sans titre</title>
<style>
li, ul {
list-style: none
}
.myNav { width:200px; background-color: #f7f3c6; border:2px solid #666666;}
.myNav-item:not(:first-child) { border-top:1px solid #4d4d4d;background-color: #f7f3c6; }
.myNav-link { display:block; padding:8px 10px;background-color: #f7f3c6; }
.myNav-content { padding:0 20px; padding-bottom:8px;background-color: #f7f3c6; }
.ui-accordion-content { display:none; }
.active > .ui-accordion-content { display:block; }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="/temporaire/php/tests/accordion-8.js"></script>
<script>
$(document).ready(function() {
  $('.myNav').simpleAccordion();
  $('.myNav2').simpleAccordion();})
</script>
</head>
<body>
<table><tr><td>
<table><tr><td>

<ul class="myNav" id="myNav">
<li class="myNav-item ui-accordion-item" id="conteneur">
  <a class="myNav-link ui-accordion-trigger" href="#">Category 1</a>
  <ul class="myNav-content ui-accordion-content">
   <li><a href="#">Category 1-1</a></li>
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
<li id="testli" class="myNav-item ui-accordion-item" id="conteneur">
  <a id="testa" class="myNav-link ui-accordion-trigger" href="#">Category 2</a>
  <ul class="myNav-content ui-accordion-content">
   <li><a href="#">Category 1-1</a></li>
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
        <li class="myNav-item ui-accordion-item">
  <a class="myNav-link ui-accordion-trigger" href="#">Category 3</a>
  <ul class="myNav-content ui-accordion-content">
 
                        <li class="myNav-item ui-accordion-item">
  <a class="myNav-link ui-accordion-trigger" href="#">sous categorie 1</a>
  <ul class="myNav-content ui-accordion-content">
   <li><a href="#">Category 1-1</a></li>
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
</ul>
</td>
<td width="100"></td>
<td>
<table><tr><td>
<ul class="myNav2">
<li class="myNav-item ui-accordion-item">
  <a class="myNav-link ui-accordion-trigger" href="#">Category 1</a>
  <ul class="myNav-content ui-accordion-content">
   <li><a href="#">Category 1-1</a></li>
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
<li class="myNav-item ui-accordion-item">
  <a class="myNav-link ui-accordion-trigger" id="cat2" href="#">Category 2</a>
  <ul class="myNav-content ui-accordion-content">
   <li><a href="#">Category 1-1</a></li>
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
        <li class="myNav-item ui-accordion-item">
  <a class="myNav-link ui-accordion-trigger" href="#">Category 3</a>
  <ul class="myNav-content ui-accordion-content">
 
                        <li class="myNav-item ui-accordion-item">
  <a class="myNav-link ui-accordion-trigger" href="#">sous categorie 1</a>
  <ul class="myNav-content ui-accordion-content">
   <li><a href="#">Category 1-1</a></li>
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
   <li><a href="#">Category 1-2</a></li>
   <li><a href="#">Category 1-3</a></li>
  </ul>
</li>
 
</ul>
</td></tr></table>
</td></tr></table>
</body>
</html>
 

et celui du JS qui va avec :


(function($) {
   $.fn.simpleAccordion = function(options) {
          var opts = $.extend({
                        'item': '.ui-accordion-item',
                        'trigger': '.ui-accordion-trigger',
                        'content': '.ui-accordion-content',
                        'active': 'active',
                        'autoClose': false,
                        'multiOpen': false,
                        'speed': 300
                  }, options);
       
          /*** [Function] Check if item is opened ***/
          var isOpen = function($item) {
                 return $item.hasClass(opts.active) ? true : false;
          };
          /*** [Function] Close accordion item ***/
          var close = function($item) {
                 $item
                        .find(opts.content).eq(0)
                        .slideUp(opts.speed, function() {
                        $item.removeClass(opts.active);
                 });
          };
          /*** [Function] Open accordion item ***/
          var open = function($item) {
                 if( !opts.multiOpen ) {
                        var $itemActive = $item.siblings('.' + opts.active);
                        close($itemActive);
                 }
                 var $content = $item.find(opts.content).eq(0);
                 $content.hide();
                 $item.addClass(opts.active);
                 $content.slideDown(opts.speed);
          };
          /*** Init accordion ***/
          return this.each(function(){
                 var $this = $(this),
                         single = $this.find( opts.item ).length ? false : true;
                 $this.find(opts.trigger).on('click.simpleAccordion', function(e){
                        e.preventDefault();
                        var $item = single ? $this : $(this).closest(opts.item);
                        isOpen($item) ? close($item) : open($item);
                 });
                 if( opts.autoClose ) {
                        $(document).on('click', function(e){
                           if( $(e.target).closest($this).length === 0 ) {
                                  if(single && $this.hasClass(opts.active)) {
                                         close( $this );
                                  }
                                  else {
                                         $this.find(opts.item + '.' + opts.active).each(function () {
                                                close( $(this) );
                                         });
                                  }
                           }   
                        });
                 }
          });
   };
})(jQuery);
 


Merci d'avance !

Problème calque d'effet + suivi de mouvement.

26 November 2018 - 21:33 PM

Bonjour.

J'ai un petit problème sur After effect. J'ai fait un calque d'effet que j'ai bien mis par dessus un calque vidéo, j'ay ai attribué un masque et un effet de colorimétrie, jusque là pas de problème, je vois bien la couleur de la zone du masque qui change sur la vidéo en dessous, mais après, je veux faire un suivi de mouvement.
Je fais donc mon suivi sur la zone de la vidéo, j'obtiens les points clés et je les attribue à mon calque d'effet.

Et là problème. mon calque d'effet bouge bien selon le suivi de mouvement comme il faut, mon masque suit donc bien la forme que je veux sur la vidéo d'en dessous, mais l'effet de colorimétrie de mon calque d'effet ne fonctionne plus.

Auriez-vous une idée pour me dépanner ?

Merci d'avance.

authorised training centre

Centre de Formation Mediabox - Adobe et Apple Authorised Training Center.

Déclaré auprès de la Direction du Travail et de la Formation Professionnelle

Mediabox : SARL au capital de 62.000€ - Numéro d'activité : 11 75 44555 75 - SIRET : 49371646800035

MEDIABOX, 23, rue de Bruxelles, 75009 PARIS

FFP