Modals and Popups

WIP

Modals
Tooltips
Pop over

Modals

<div id="loginModal" class="m-modal">
  <div class="m-popup">
    <header>
      <h4>Pop-up</h4>
      <a href="" class="x-icon-link" data-closeModal="true">
        (x)
      </a>
    </header>
    <div class="embed-player-container">
      <iframe src="/film/dehors_novembre/embed/player/" width="560" height="315" frameborder="0"></iframe>
    </div>
  </div>
</div>

Ouvrir le pop-up

Tooltips

broken

Please see working versions on nfb.ca (authorization requierd)

fr ::Il faut ajouter la classe is-greyTooltip sur le lien et entrer le texte qui sera afficher dans la bulle dans l’attribut data-original-title.

Il s’agit des tooltip bootstrap stylisé.

Tooltip gris

<a href="javascript:void(0);" class="is-greyTooltip"  data-original-title='Infos supplémentaires'>Tooltip gris</a>

Pop over

broken

Please see working versions on nfb.ca (authorization requierd)

fr :: Il s’agit des popOver de bootstrap stylisé. Le container et le trigger peuvent être passé via les attributs data-container et data-trigger.

<span class="is-popoverLink helpInfos" data-placement="auto" data-trigger="popover"  title="Titre" data-container="<small>Contenu</small>">?</span>