18034 sujets

Questions générales et questions de débutants

Changer taille d'un texte en jquery

bonjour je débute dans jquery et j'essaie un exercice que je n'arrive pas a faire .
je vous donne le code :

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <link rel="stylesheet" href="style.css">
<script type="text/javascript" src="javascript.js"></script>  <script src="jquery-2.1.4.js"></script>
</head>

<body>
    <div><p>hello la compagnie</p></div>
</body>
</html>




html {
	margin: 0;
	padding: 0;
	}
body { 
	color: #555753; 
	margin: 0; 
	padding: 0;
	}
div {
    width:200px;
    height:100px;
    background-color: aqua;
    margin:auto;
}
p {
    text-align:center;
    padding-top:50px;
    font-size:20px;
}




$(document).ready(function () {

    $('p').click(function () {
    $(this).css('font-size', "100px");;    
    });
});


voila si quelqu'un peut me donner une petite piste sa serai vraiment sympas Smiley biggrin .
Modifié par kynnek (14 Oct 2015 - 12:50)
je te remercie pour ta réponse , ça à effectivement fonctionné, peut tu me donner un indice sur la démarche a suivre pour revenir a la taille initiale toujours au click ?
Si font-size est la seule propriété que tu modifies, tu peux faire 

$(this).removeAttr("style");

ou alors, tu gardes dans une variable la taille initiale avant le click, et tu lui rends sa valeur initiale quand tu le souhaites.

Ou tu le fais avec des classes css: Au clique, tu ajoute une class qui contient la propriété font-size:100px, et quand tu veux revenir à la valeur initiale, tu enlèves cette classe.
Salut, tu peux utiliser un toggleclass dans ce cas.
<style type="text/css">
  p {
    font-size: 14pt;
  }    
  p.larger {
    font-size: 16pt;
  }
</style>

<script>    
  $('input').click(function() {
    $('p').toggleClass('larger');
  })
</script>


à adapter
Modifié par JENCAL (14 Oct 2015 - 13:25)
Sujet clos
Aller à