Strona Artura

Przykładowy kod z użyciem jQuery

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <style>

    .boldGray{

        font-weight : bold;

        color : gray;

        }

    </style>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

    <script type="text/javascript">

        $(document).ready(

                function()

                {

                    $('#textDiv p').addClass('boldGray');

                    $("#textDiv p").css({background : "blue"}).delay(2000).slideUp().delay(1000).fadeIn(1000);

                    $('#textDiv p').text('Taki sam tekst.');

                    $("p").click(function()
                    {
                    $(this).hide();
                    });

                    // $("p").click(function()
                    // {
                    // $(this).hide();
                    // });
               
                    $("button").click(function()
                    {
                    $("p").hide();
                    });

                    $("#p1").mouseenter(function(){
                    alert("You entered p1!");
                    });

                });
               
    </script>

    <title>Ćwiczenia jQuery</title>

</head>

<body>

        <div id='textDiv'>

             <p>To jest pierwszy przykładowy akapit.</p>

              <p>To jest drugi przykładowy akapit.</p>

              <p>To jest trzeci przykładowy akapit.</p>

        </div>

        <button>Kliknij</button>

        <p id="p1">Lorem ipsum dolor sit amet consectetur adipisicing elit. In libero placeat accusamus, quos
            eligendi quae, necessitatibus perferendis, nulla aut provident molestias. Eaque minus
            cupiditate suscipit mollitia impedit quae ad aperiam?</p>

</body>

</html>