Bonjour
J'essaie de faire une page web adaptée à l'IPad, et j'aimerais faire un bouton dont la couleur change lorsqu'on clique dessus (du rouge au vert et inversement), tout en utilisant jquery.mobile.css... ce qui pose problème car cela empêche l'affichage de la couleur du bouton... Il y a peut-être une modif a apporter au jquery css?
Merci pour votre aide.
Code :
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM+ 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <link rel="stylesheet" href="jquery.mobile.css" type="text/css" media="all" /> <!-- en enlevant cette ligne le bouton change bien de couleur-->
- <title>Document sans nom</title>
- <style>
- .st1
- {background-color:green;}
- .st2
- {background-color:red;}
- </style>
- <script src="jquery.js"></script>
- <script src="jquery.mobile.js"></script>
- <script>
- $(function(){
- $(".st1" ).click(function(){
- $(this).toggleClass("st2" );
- });
- });
- </script>
- </head>
- <body>
- <div data-role="page" id="test1">
- <div data-role="header">
- <h2>TEST</h2>
- </div>
- <div data-role="content">
- <h3>TEST2</h3>
- <button class="st1" data-role="button">Essai</button>
- </div>
- </div>
- </body>
- </html>
|