HTML projects

 Project 1

Name: HTML pdf viewer

Code

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

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

    <title>PDF Viewer</title>

    <style>

        body {

            font-family: Arial, sans-serif;

            text-align: center;

        }

        select {

            margin: 20px;

            padding: 10px;

        }

        iframe {

            width: 80%;

            height: 500px;

            border: 1px solid #ccc;

            margin-top: 20px;

        }

    </style>

</head>

<body>

    <h2>Select a PDF Report</h2>

    <select id="pdfSelector" onchange="loadPDF()">

        <option value="">-- Select a Report --</option>

        <option value="https://marico.com/investorspdf/Earnings_Presentation_Q3FY25.pdf">Tata Power</option>

        <option value="https://www.tatapower.com/content/dam/tatapoweraemsitesprogram/tatapower/pdf-root/company-financials/quarterly-results-presentation/2024/Q2%20FY25%20Analyst%20Call%20Presentation-Oct%2024.pdf">Marico</option>

        <option value="report3.pdf">Report 3</option>

    </select>

    <br>

    <iframe id="pdfViewer" src="" hidden></iframe>

    <script>

        function loadPDF() {

            var selector = document.getElementById("pdfSelector");

            var viewer = document.getElementById("pdfViewer");

            var selectedPDF = selector.value;

           

            if (selectedPDF) {

                viewer.src = selectedPDF;

                viewer.hidden = false;

            } else {

                viewer.hidden = true;

            }

        }

    </script>

</body>

</html>