Index.html lehe

Minu index.html leht

<!DOCTYPE html>
<html lang="et">
<head>
    <meta charset="UTF-8">
    <title>Talibova koduleht</title>
    <link rel="stylesheet" href="rrr.css">
    <script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
    <script src="https://code.jquery.com/ui/1.14.1/jquery-ui.min.js" integrity="sha256-AlTido85uXPlSyyaZNsjJXeCs07eSv3r43kyCVc8ChI=" crossorigin="anonymous"></script>
    <script>
        function yellowseks() {
            $('section').css('color', 'yellow');
        }
        function pinkseks() {
            $('h1').css('color', 'pink');
        }
        function mustaks() {
            $('h1, section').css('color', 'black');
        }
        var lahti = true;

        function naitapeida() {
            $('section').slideToggle();
            if (lahti) {
                lahti = false;
                $('#knopka').val("Näita");
            } else {
                lahti = true;
                $('#knopka').val("Peida");
            }
        }

        function start() {
            $('section').mouseenter(yellowseks);
            $('h1').mouseenter(pinkseks);
            $('h1, section').mouseleave(mustaks);
            $('#dog').draggable();
        }
    </script>
</head>
<body onload="start()">
<header>
    <h1> Talibova Leyla koduleht</h1>
</header>
<nav>
    <!-- Add links here if needed -->
</nav>
<ul>
    <li><a href="index.html">kodu</a></li>
    <li><a href="synavara.html">Sõnavara</a></li>
    <li><a href="tehtudTood.html">Tehtud tööd</a></li>
    <li><a href="kasutatudLingid.html">kasulikud lingid</a></li>
</ul>
<main>
    <section>
        <h2>INFO MINUS</h2>
        <div>Minu olen õpilane
            <br>
            Minu hobbyd kõndida
            <br>
            Minu eriala TITpv24
        </div>
    </section>
</main>
<footer>
    <strong>Talibova Leyla &copy; 2024</strong>
</footer>

<!-- Optional spacing using CSS -->
<!-- Use CSS for margin or padding instead of <br> -->
<br>
<br> <br> <br> <br>
<br><br> <br> <br>
<br> <br>
<br><br>
<input type="button" value="-->" onclick="$('section').animate({left:'600px'},1000)">
<input type="button" value="<--" onclick="$('section').animate({left:'0px'},1000)">
<input type="button" value="peida" onclick="naitapeida()" id="knopka">

<img src="dog.jpg" alt="dog" id="dog" width="200px">
</body>
</html>