La page à Guillaume


 
 
 

   Accueil   Faire sa page WEB   Apprendre le WEB   Mes fichiers d'aide   Aides mémoires   Javascript   jQuery   Exemples jQuery   Exemple jQuery

exemple jquery

 

Exemple de script :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <title>Formation jQuery</title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<!--
        <link rel="stylesheet" href="demo.css" type="text/css" />
-->
        <style>
            .pink {
                background-color: pink;
                font-weight:bold;
            }
            .bleu {
                background-color: blue;
                font-weight:none;
            }       
        </style>
    </head>
    <body>
        <div id="titre1" class="titre1">
            titre1
            <div id="titre2" class="titre2">
                <span id="titre4" class="titre4">titre4</span>
                <span id="titre5" class="titre5">titre5</span>
                <span id="titre6" class="titre6">titre6</span>
            </div>
            <a href="#" class="zaza">lien 1</a><br>
            <a href="#" class="zaza">lien 2</a><br>
            <a href="#" class="zaza">lien 3</a><br>
            <hr />
        </div>
        <br />
        <div class="dynamique"></div>
        <a href="#" class="zozo">add</a><br>

        <script type="text/javascript" src="../js/jquery-1.2.6.min.js"></script>

        <script type="text/javascript">
            $("div").css("border", "1px solid gray");
            $("div.titre2").css("text-align", "center");
            $("div.titre2 span").css("border", "2px inset gray");
            $("span.titre5").css("background-color", "#b6b6b6");
        </script>

        <script type="text/javascript">
            $("a.zaza").hover(
              function () {
                $(this).addClass("pink");
              },
              function () {
                $(this).removeClass("pink");
              }
            );
        </script>

        <script type="text/javascript">
            var newLine = "<span>A</span> ";
            $("a.zozo").click(
              function () {
                $("div.dynamique").append(newLine);
              }
            );
        </script>

    </body>
</html>



Quelques liens :
  • http://jquery.com
  • http://www.jquery.info
  • http://jquery.developpeur-web2.com
  • http://visualjquery.com

 
 
Accueil - Plan du site