← Tous les exemples

JavaScript Développeur & QA

Taille de l'élément au survol

Affiche une petite info-bulle avec la largeur et la hauteur de l'élément survolé.

Code à copier

try {
  const tip = document.createElement('div');
  tip.style.cssText = 'position:fixed;z-index:99999;background:#282828;color:#ebdbb2;'
    + 'font:11px monospace;padding:3px 6px;pointer-events:none;border-radius:3px;display:none;';
  document.body.appendChild(tip);
  document.addEventListener('mousemove', function (e) {
    const el = e.target;
    if (!el || el === tip) return;
    const r = el.getBoundingClientRect();
    tip.textContent = el.tagName.toLowerCase() + ' '
      + Math.round(r.width) + ' x ' + Math.round(r.height);
    tip.style.left = (e.clientX + 14) + 'px';
    tip.style.top = (e.clientY + 14) + 'px';
    tip.style.display = 'block';
  });
} catch (err) { console.error('JustZix box dimensions:', err); }

Comment utiliser cet exemple

  1. Copiez le code avec le bouton ci-dessus.
  2. Installez JustZix (2 minutes) et ouvrez l'extension sur la page cible.
  3. Ajoutez une nouvelle règle correspondant à cette page.
  4. Collez le code dans le panneau JavaScript de la règle et enregistrez — il s'exécute à chaque visite de page.

Notez cet exemple

Aucune note — soyez le premier.

Cet exemple fonctionne-t-il ?

Les snippets sont inutiles sans un endroit où les coller.

JustZix s'installe en 2 minutes et exécute votre code sur chaque page correspondante. Sans compte, sans paiement.

Télécharger gratuitement Voir les cas d'usage