-1

Atualmente a minha caixa suspensa está aparecendo abaixo de todos os outros elementos:

inserir a descrição da imagem aqui

Eu gostaria que ela aparecesse acima do botão Radar 1 e da caixa de texto ao lado.

Pois bem, eu tentei definir a posição da seguinte forma:

    <body style="background-color:black;">
        <div class="row">
            <div class="column left">
                <form action="" method="post" id="url-setter1">
                    <button class="button" id="botaoradar1" onclick="radarzinho1()">Radar 1</button>
                    <input type="text" name="url1" id="url1" style="width: 283px;" />
                    <iframe id="the-frame1" width="347" height="282" src=""></iframe>
                    <script src="http://d3js.org/d3.v3.js"></script>
                    <script>
                        d3.csv("Lista_de_Jogos.csv", function(error, data) {
                          var select = d3.select("#url-setter1")
                            .append("select")

Mas a caixa suspensa continua aparecendo no final da página, o que devo modificar para que ela seja o primeiro elemento dentro de form?

6
  • 1
    uma das soluções será fazer o append da select e somente depois fazer o append ao resto dos elementos. 20/07/2021 às 13:40
  • Bom dia @AlexisGarcia, tudo tranquilo? Você poderia exemplificar um caminho para tal? Pelo que entendi você indicaria fazer algo como .append("ALGUMA COISA").append("select"), seria isso? Se sim, o que eu poderia colocar no lugar de ALGUMA COISA? Pois já tentei com algumas opções e não deram nada certo. 20/07/2021 às 13:46
  • 2
    posta o html e css das divs para eu usar como exemplo 20/07/2021 às 13:50
  • Desculpe a falta de conhecimento no tema, mas só para compreender: você quer que eu adicione o script completo na pergunta? Seria isso? Se sim, adiciono sem problemas. Caso não seja isso, seria o código fonte da página ou a página Elements no Dev Tools do navegador? 20/07/2021 às 13:59
  • 1
    Vou dar um exemplo 20/07/2021 às 14:33

1 Resposta 1

0

Você pode usar o .insertBefore() em vez do .append();

$('button').click(
  function(){
    $('<div class="primeiro">Primeiro Elemento</div>').insertBefore('.segundo');
});
.container{
width: 300px;
height: 300px;
background-color: red;
}
button{
margin-top:20px;
}
.segundo{
margin: 20px 0;
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
<div class="segundo"> Segundo elemento</div>
<div class="terceiro">Terceiro elemento</div>
<button>Click para inserir o primeiro elemento</button>
</div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .