Gustavo Augusto Lopes

26 de setembro de 2020

var langs = {

 pt:"Portugues",

 en:"inglês"

}



function translate(lang){

    console.log(`${langs}.${lang}`)

}



translate("en")

Tenho esse código, gostaria de saber se tem como eu acessar algum dos objetos de langs usando um parametro passado pela função, como tentei fazer, mas o console só me retorna:

[object Object].en

10 de julho de 2020

Direto ao ponto,

Estou desenvolvendo uma página apenas para estudo, e decidi colocar um botão fixo na parte inferior direita da pagina, daqueles onde se clica para voltar ao topo da página, mas quando monto ele e dou um position:fixed, ele simplesmente some. Testei o position:fixed em alguns elementos e notei que nenhum fica fixo na tela.

O botão se encontra no fim do HTML com id="scrollTop" e do CSS

Segue o código:

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <!--BOOTSTRAP.CSS-->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
        integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Titillium+Web:wght@700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css" />


    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rocket Apps</title>
    <link rel="stylesheet" href="css/home.css">
</head>

<body>
    <div>

        <div id="cabecalho">
            <ul class="list-group list-group-horizontal">
                <li class="list-group-item" style="margin-left: -100px;">
                   <a href="#"><h4>Home</h4></a> 
                </li>
                <li class="list-group-item" style="margin-left: 100px;">
                    <a href="#"><h4>Produtos</h4></a> 
                </li>
                <img style="margin-left: 100px;" src="imgs/logo.png" id="fogueteTop" onclick="fogueteClick()"
                    class="animate__animated animate__fadeInBottomLeft animate__slow">
                <li class="list-group-item" style="margin-left: 100px;">
                    <center>
                        <a href="#"><h4>Trabalhe Conosco</h4></a> 
                    </center>
                </li>
                <li class="list-group-item" style="margin-left: 100px;">
                    <a href="#"><h4>Contato</h4></a> 
                </li>
            </ul>
        </div>


        <div id="content" class="animate__animated animate__fadeInLeft">
            <div id="slogan">
                <h2>
                    Trabalhamos com<br><span>experiências</span> que <br> alavancam negócios
                </h2>
                <small class="detail">Somos uma empresa de inovação digital e desenvolvimento de
                    software que impulsionará o crescimento do seu negócio</small>
                <div class="info-footer">
                    <a id="btnContato" href="#" onmouseenter="btnEnter()" onmouseout="btnOut()"
                        class="btn contact animate__pulse animate__infinite" style="color: #7a1be6;">Entre em Contato conosco</a>
                    <a href="#" class="about">Leia sobre nós ></a>
                </div>
            </div>


        </div>
        <div id="logo-right">
            <img src="imgs/logo-right.png" class="animate__animated animate__fadeInBottomLeft animate__slow">
        </div>


        <div id="missaovisaovalores">
            <div class="container">
                <ul>
                    <li>
                        <i>
                            <img src="imgs/missao.png" alt="">
                        </i>
                        <h3>Missao</h3>
                        <p>Proporcionar aos pequenos empreendedores a possibilidade de engajar no mundo do Ecommerce e
                            crescer seu negócio muito além do esperado.</p>
                    </li>

                    <li>
                        <i>
                            <img src="imgs/visao.png" alt="">
                        </i>
                        <h3>Visão</h3>
                        <p>Ser a opção preferida dos micro-empreendedores que buscam a expansão do seu comércio, com o
                            melhor custo benefício de todas as alternativas.</p>
                    </li>

                    <li>
                        <i>
                            <img src="imgs/valores.png" alt="">
                        </i>
                        <h3>Valores</h3>
                        <p>Pontualidade junto com qualidade é o foco do nosso negócio, buscamos solucionar os problemas
                            dos nossos clientes sem perder a qualidade de atendimento e do produto.</p>
                    </li>
                </ul>
            </div>
        </div>

        <div id="produtos">
            <div id="container">
                
            </div>
        </div>

        <br><br><br><br><br><br><br><br>
        <footer id="rodape">
            <div class="rodapeContent">
                <div class="logo">
                    <img src="imgs/logo.png" alt="">
                </div>

                <div class="rodapeEmail">
                    <br>
                    <h5>Início</h5><br>
                    <p>Home</p>
                    <p>Produtos</p>
                </div>

                <div class="rodapeSobre">
                    <br>
                    <h5>Sobre Nós</h5><br>
                    <p>Empresa</p>
                    <p>Contato</p>
                </div>

                <div class="rodape">

                </div>
            </div>
        </footer>

    </div>
    <div id="scrollTop">
        <a href="#"><button>^</button></a>
    </div>

    <!--JS Bootstrap-->
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
        crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"
        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
        crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
        integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
        crossorigin="anonymous"></script>

    <script src="js/home.js"></script>
</body>

</html>

css

html{
    scroll-behavior: smooth;
}

body{
    margin: 0;
    background-color: transparent;
    background-image: url('/imgs/bg-home.jpg');
    background-repeat: no-repeat;
    background-position: 0% -100px;
    background-size: 120% 1000px;
}
/*LINKS*/
a{color: inherit}
a:link{text-decoration: none;color: inherit}
a:visited{text-decoration: none;color: inherit}
a:hover{text-decoration: none;color: inherit}
a:active{text-decoration: none;color: #9a6bcf;text-decoration:none;}
/*Cabecalho*/
#cabecalho{
    color: #9a6bcf;
    margin-top: 30px;
    height: 60px;
    font-family: 'Oswald', sans-serif;
}
#cabecalho ul {

    position: absolute;
    left: 50%;
    transform: translate(-50%);
}

#cabecalho ul li{

    border: none;
    background-color: transparent;
}

#cabecalho img{
    width: 100px;
    height: 100px;
    margin-top: -20px;
}


/*CONTENT*/

/*Slogan*/
div{
    display: block;
}

#content{
    margin: 100px;
    color: white;
}
#slogan{
    float: left;
    max-width: 480px;
}

#slogan h2{
    text-align: justify;
    font-size: 2.8rem;
    font-family: 'Titillium Web', sans-serif;
}
#slogan span{
    color: #8c57c9;
}

#slogan a{
    margin: 0;

}
.info-footer{
    margin-top: 40px;
}

.info-footer .about{
    padding-left: 25px;
    color:#c4a7e6;
    font-family: 'Titillium Web', sans-serif;
    margin-left: 5px;
    letter-spacing: 1.2px;
}
.detail{
    text-align: center;
    font-size: 1.1rem;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700;
    line-height: 1.3;
    color:#c4a7e6
}
.contact{
    margin-top: 25px;
    height: 50px;
    font-size: 1.2rem;
    font-weight: 700;
    background-color: white;
    color: #7a1be6;

}

/*Logo Direita*/
#logo-right{
    margin-top:-80px;
    float: right;
}
#logo-right img{
    width: 500px;
    height: 500px;
}

/*Missao Visao Valores*/
#missaovisaovalores{

    background-color: white;
    width: 100%;
    bottom: 0;
    height: 500px;
    margin-top: 100vh;

}
#missaovisaovalores .container{
    margin-top: 0;
    position: relative;
    top: 50%;

    transform: translate(0, -50%);

}
#missaovisaovalores ul{
    top: 0;

}

#missaovisaovalores ul li {
    position: relative;
    text-align: center;
    display: inline-block;
    height: 230px;
    max-width: 230px;
    margin-left: 8%;
}
#missaovisaovalores p{
    text-align: center;
    font-size: 0.75rem;
}

/*Produtos*/
#produtos{
    background-color: red;
    width: 100%;
    height: 500px;
}





/*RODAPE*/
#rodape{
    position: absolute;
    bottom: 0;
    min-height: 200px;
    background-color: #2e2e2e;
    color: white;    
    position: relative;
}

#rodape .rodapeContent{
    margin: 20px;
}

#rodape .logo img{
    margin-top: 30px;
    margin-left: 100px;
    width: 150px;
    height: 150px;
    float: left;
}

#rodape .rodapeEmail{
    width: 15%;
    float: left;
    margin-left: 200px;
}
#rodape p{
margin-top: -15px
}




/*Scroll Top*/
#scrollTop{

    position: absolute;

    left: 90%;
}
#scrollTop a{
    position: fixed;
    padding-top: -50px;
    width: 50px;
    height: 50px;
    text-decoration: none;
    background-color: green;
}

8 de julho de 2020

@Programadora Iniciante Todo o conteúdo presente dentro das tags <script> ... </script> estão formadas por JavaScript.

Ele utilizou do HTML, CSS e JavaScript

6 de julho de 2020

Depende, se você se refere a códigos HTML onde ao olhar o source ele está todo em uma linha, basicamente o criador do código fez uma especie de "mini" criptografia onde todo o código fica em 1 linha para as pessoas terem mais dificuldade de edição direta no site, mas é possível copiar todo aquele código de 1 linha e colar em algum html beautifier que vai identar o código HTML automaticamente.

Outros poréns tem na parte de JS onde tem as criptografias que fazem a troca das variaveis por outros nomes, e depois transforma todo o código em alguma criptografia hexadecimal ou do tipo para dificultar o programador a identificar as funções.

Creio que essa seja sua duvida, basicamente as pessoas usam criptografias para dificultar os espertinhos que querem entender o funcionamento de uma página.

5 de julho de 2020

<!DOCTYPE html>

<head>

    <title>Caça-palavras
        <meta charset="utf-8">
    </title>
</head>

<body bgcolor="yellow">

    <font>
        <center>
            <font color="red"> Caça-palavras
            </font>
            <br />
            <font color="blue">
                Objetos de casa
        </center>
        <br />
    </font>

    <div id="jogo">
        <table border="4" align="center">
            <tr align="center" onclick="errado()">
                <td>
                    <font color="black" size="4" face="Tahoma">C</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">D</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">V</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">C</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">L</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">A</font>
                </td>
            </tr>
            <tr align="center" id="correto" onclick="correto()">
                <td>
                    <font color="black" size="4" face="Tahoma">A</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">B</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">A</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">J</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">U</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">R</font>
                </td>
            </tr>
            <tr align="center" onclick="errado()">
                <td>
                    <font color="black" size="4" face="Tahoma">M</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">B</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">S</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">H</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">J</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">L</font>
                </td>
            </tr>
            <tr align="center" onclick="errado()">
                <td>
                    <font color="black" size="4" face="Tahoma">A</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">K</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">O</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">F</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">X</font>
                </td>
                <td>
                    <font color="black" size="4" face="Tahoma">W</font>
                </td>
            </tr>

        </table>
    </div>

    <script>
        //Quando clicar na palavra correta o backgroud da ficará vermelha
        function correto() {
            document.getElementById('correto').style.backgroundColor = 'red'
        }

        //Número de tentativas clicando no errado
        var tentativas = 5
        
		//Função caso clique no errado para as tentativas diminuirem
        function errado() {
            tentativas = tentativas - 1
            alert('Ops, essa não é uma palavra! Agora você tem: ' + tentativas + ' chances')

            if (tentativas == 0) {
                alert('Suas chances acabaram')
                document.getElementById('jogo').innerHTML = '<center><h1>FIM DE JOGO </h1></center>'
            }
        }
    </script>
</body>

Tenta esse código que implementei o seu e diz se é algo do tipo! ^^ se for, posso ajudar a prosseguir.

3 de julho de 2020

Não é algo complicado, o esquema é que ao invés de usar um placeholder, você terá de usar um <span> ou coisa do tipo pra exibir um texto, colocar ele com position: absolute para ele ficar em cima do input, e fazer um input:focus + span, com isso você coloca o que vai ser alterado no span quando o input estiver em focus, basta reajustar o margin top para que o span fique acima do input, e o font-size diminuir.

Por fim a chave de tudo é o transition: all 300ms que deve ser inserido no elemento do span, onde todas as transições realizadas nele vão levar 300ms, tempo reajustável de acordo com sua preferência.

Segue exemplo do código na prática:

https://jsfiddle.net/Ted2370/txfz5bes/22/

Obs.:Desculpa a má formatação da resposta, sou novato no server >.< mas espero ter ajudado!

24 de novembro de 2019

Olhem a frequência base da cpu. Está em 5,90. É normal?Eu aumentei o baseclock cpu/memory na placa-mãe, já faz uns 5 dias, até agora nada de tela azul ou algum erro, mas hoje reparei que a frequência pelo gerenciador de tarefas ta apontando 5,90GHz! isso aumenta o desempenho?

Entrar

Gustavo Augusto Lopes

Posts

Cadastrado em

Última visita

Tipo de conteúdo

Artigos

Selos

Fabricantes

Livros

Cursos

Análises

Fórum

posts postados por Gustavo Augusto Lopes

acessar objeto pelo parâmetro da função

Position Fixed não funciona

Jogo de caça-palavras usando Visual G e Javascript

Códigos fonte muito grandes.

Jogo de caça-palavras usando Visual G e Javascript

Efeito no input do login?

Frequencia base em 5,90GHz??

Sobre o Clube do Hardware

Direitos autorais

Mais

Fórum

Atividades

Artigos

Análises

Livros

Cursos