Mdantas26 / Portal-Noticia

Esse é um trabalho desenvolvido para fins de apresentação acadêmica
0 stars 0 forks source link

Código com link #1

Open ozscosta opened 1 year ago

ozscosta commented 1 year ago
<html>

<head>
    <title> Portal de Noticias Unitins</title>
    <link href="css/style.css" rel="stylesheet" />
    <meta charset="UTF-8">
</head>

<body>
    <header>
        <div class="center">
            <div class="about-header">
                <p>Universidade Estadual do Tocantins</p>
            </div>
            <div class="wraper-header">
                <div class="logo">
                    <h2><span> Unitins </span>News</h2>
                </div>
                <div class="banner-ads">
                    <h2><span style="font-size: 23px;">Unitins News</span><br /> Insira um anúncio aqui</h2>
                </div>
            </div>
        </div>
    </header>
    <!--FIM HEADER-->

    <div class="center">
        <div class="menu-main">
            <a href="#">Inicio</a>
            <a href="#">Noticias</a>
            <a href="#">Sobre Nós</a>
            <a href="#">Contato</a>

        </div>
    </div>
    <section class="noticias-1">
        <div class="center">
            <div class=" noticias-wraper-1">
                <div class="noticias-destaque">
                    <div style="background-image: url('https://www.unitins.br/cms/Midia/Imagens/OQDFTIFXGQIB8L4ZZMBSNPVQDLEMMF9YPLW4HGFYD9I.png');"
                        class="noticias-destaque-single"
                        data-link="https://www.unitins.br/nPortal/portal/noticias/detalhes/4967-2023-5-16-unitins-lanca-vestibular-20232-com-240-vagas-inscricoes-comecam-nesta-quinta-18">
                        <h3>Unintins abre vestibular para varios cursos</h3>
                    </div>
                </div>
                <div class="outras-noticias-1">
                    <div style="background-image: url('https://gazetadocerrado.com.br/wp-content/uploads/2021/11/Unitins.jpg')"
                        class=" outra-noticia-1-single" data-link="https://g1.com.br">
                        <h3>TÔ GRADUADO está como uns dos projetos mais decadentes da Universidade</h3>
                    </div>
                    <div style="background-image: url('https://st3.depositphotos.com/10539404/36956/i/600/depositphotos_369561866-stock-photo-farmer-is-studying-the-development.jpg');"
                        class=" outra-noticia-1-single" data-link="https://globo.com">
                        <h3>TÔ GRADUADO abre vaga para Professor formado em Agronomia</h3>
                    </div>
                    <div style="background-image: url('https://iftm.edu.br/cursos/uberlandiacentro/tecnologo/sistemas-para-internet?arq=872c7c99f98908a8e980c9c5d0f4017e')"
                        class=" outra-noticia-1-single" data-link="https://r7.com">
                        <h3>TÔ GRADUADO abre vaga para Professor formado em Sistemas para Internet</h3>
                    </div>
                    <div style="background-image:url('https://consorciociga.gov.br/wp-content/uploads/2017/05/eficiencia-na-gest%C3%A3o-p%C3%BAblica-1.jpg')"
                        class=" outra-noticia-1-single" data-link="https://unitins.br">
                        <h3>TÔ GRADUADO abre vaga para Professor formado em Gestão Pública</h3>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <script>
        let noticias = document.querySelectorAll('[data-link]');
        noticias.forEach((item) => {
            item.addEventListener('click', () => {
                const link = item.dataset.link;
                window.location.href = link;
            })
        })
    </script>
</body>

</html>
ozscosta commented 1 year ago

Caso queria abrir o link em nova aba, usando o element A, tu pode colocar o target="_blank". Usando o javascript, como está nesse código, substitua o window.location.href = link por window.open(link)