Jquery et CSS

Résolu/Fermé

maxtheirish Messages postés 23 Date d'inscription mercredi 29 décembre 2010 Statut Membre Dernière intervention 14 février 2012 - 7 févr. 2012 à 12:31
Icarna - 11 janv. 2013 à 20:45

Bonjour,

Je me demande si il est possible en Jquery de "prendre" ou copier le CSS d'un élément (type bloc comme une div par ex) pour l'affecter à un autre élément du même type et si oui comment faudrait t-il procéder pour faire au plus simple.

Merci.

A voir également:

Jquery et CSS
Enlever couleur lien css ✓ - Forum CSS
Mettre une image à gauche css ✓ - Forum CSS
Css exposant ✓ - Forum CSS
Déplacer une image css - Forum CSS
Css download - Télécharger - HTML

3 réponses

Réponse 1 / 3

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
7 févr. 2012 à 16:22

Hello,

Tu as meilleur temps de définir une classe en CSS et de l'affecter avec jQuery à tous les div donc tu souhaite clôner la mise en page.

Voila un exemple:

<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <style type="text/css" media="screen">
    div{
      border:#333 solid 5px;
      background-color:#888;
      color:#333;
      width:75px;
      height:75px;
      float:left;
    }
    .masterDiv, .cloneDiv{
      width:200px;
      height:200px;
      background-color:green;
    }
    .cloneDiv.ugly{
      background:url('http://c.dryicons.com/images/icon_sets/valentines_icons_set/png/256x256/kiss.png') center center no-repeat;
      background-color:green;
      color:white;
    }
  </style>
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
  <script type="text/javascript" charset="utf-8">
    $(function(){
      $('.ugly').click(function(){
        $(this).addClass('cloneDiv');
        $(this).html('Merciii ! Je suis devenu un clône du beau.');
      });
    });
  </script>
</head>
<body>
  <div class="masterDiv">Je suis beau</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
  <div class="ugly">Je suis tout moche. click-moi!</div>
</body>
</html>

Réponse 2 / 3

maxtheirish Messages postés 23 Date d'inscription mercredi 29 décembre 2010 Statut Membre Dernière intervention 14 février 2012
9 févr. 2012 à 11:14

Oui merci je m'en suis rendu compte après coups, j'aime beaucoup ton exemple par ailleurs ^^ ;)

Réponse 3 / 3

Icarna
11 janv. 2013 à 20:45

Et même question, si on a pas la possibilité de créer cette classe intermédiaire. Ou plutôt qu'on ne le souhaite pas. Peut-on copier avec quelque chose du genre CSSStyleDeclaration, setStyle ? ...

Merci par avance.

Discussions similaires

[CSS] Forcé retour à la ligne

trait horizontal avec du css

[CSS] Mettre un objet au premier plan

HTML - définir taille bouton

Enlever le soulignement sous les liens en HTML/CSS

Discussions similaires

Newsletters