há como exibir imagens especificas a locais pre determinados em uma pagina HTML usando CSS e JS

[santans 0]

Desejo fazer o seguinte:

 

Designar imagens a molduras pré definidas em uma pagina html usando javascript.

 

Ex. criei o seguinte código html:

<div id="container">
        <div class="menu-roupa">
            <div class="box-produto">
                <img name="imga" class="exibir-img">
            </div>

            <div class="box-produto">
                <img name="imgb" class="exibir-img">
            </div>

            <div class="box-produto">
                <img name="imgc" class="exibir-img">
            </div>
        </div>
    </div>

 

 

 

E defini o tamanho de cada moldura com o css:

#container{
    
    width: 100%;
    
/* Orientação dos blocos de conteudo dentro do bloco principal / pai*/

    display: flex;
    align-items: center;
    justify-content: space-between
}

.container-index{
    height: 400px;
    background-image: url(a.png);
}

.menu-roupa{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 80%;
    height: 550px;
    margin-left: 10%;
    margin-right: 10%;
    background-color: aquamarine;
}

.box-produto{
    width: 300px;
    height: 450px;
    background-color: bisque;
}

.exibir-img{
    height: 300px;
    width: 300px;
}

agora quero desenvolver uma aplicação JS que desloque a imagem especifica para cada uma das box`s pre definida por  A, B e C.

 

 

 

[andersonhese 0]

Boa tarde,

 

Utilizando JQuery é simples

$("img[name='imga']").attr('src','https://assets-cdn.github.com/images/modules/logos_page/GitHub-Logo.png')

$ - chamada da lib do JQuery (https://jquery.com/)

("img[name='imga']") - buscando o elemento "img" que possuí o atributo "name" com o valor "imga"

.attr - função para buscar ou alterar atributos, para buscar use .attr("atributo"), para alterar utilize .attr("atributo", "valor")

('src', 'https://...') - altera o atributo 'src' para o valor setado.

 

Espero que ajude.

 

[santans 0]

Muito obrigado ajudou bastante