Jquery et CSS

Résolu

maxtheirish Messages postés 23 Statut Membre -
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.

Afficher la suite

3 réponses

prosthetiks Messages postés 1309 Statut Membre 431

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 Statut Membre

Oui merci je m'en suis rendu compte après coups, j'aime beaucoup ton exemple par ailleurs ^^ ;)
0
Réponse 3 / 3
Icarna

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.
0

Jquery et CSS

3 réponses

Discussions similaires

Newsletters