Ir para conteúdo

Pesquisar na Comunidade

Mostrando resultados para as tags ''div''.

  • Pesquisar por Tags

    Digite tags separadas por vírgulas
  • Pesquisar por Autor

Tipo de Conteúdo


Todas as áreas do Fórum

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Desenvolvimento Web
    • Desenvolvimento frontend
    • Javascript
    • PHP
    • Ruby
    • Python
    • Java
    • .NET
    • Docker, Kubernets e outros ambientes
    • Desenvolvimento com Wordpress
    • Desenvolvimento de apps
    • Desenvolvimento ágil
    • Desenvolvimento de Games
    • Banco de Dados
    • Design e UX
    • Algoritmos & Outras Tecnologias
  • Entretenimento e uso pessoal
    • Segurança & Malwares
    • Geral
    • Boteco iMasters

Encontrar resultados em...

Encontrar resultados que...


Data de Criação

  • Início

    FIM


Data de Atualização

  • Início

    FIM


Filtrar pelo número de...

Data de Registro

  • Início

    FIM


Grupo


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Encontrado 29 registros

  1. Alessandro Bodão

    H1 que preencha toda a largura da container

    Fala galerinha, Tenho um container com um título (h1) no cabeçalho do meu site, esse container ocupa metade da tela (50vw), e eu gostaria que esse título ocupasse toda a largura desse container, independente do seu tamanho ou do tamanho do monitor, de forma com que a palavra tenha exactamente o mesmo tamanho do container (vou anexar uma foto de exemplo). Já tentei todos os valores pra essa h1, como % e vw... mas nada parece fazer sentido.
  2. Giovanird

    Cor da div conforme o valor do value

    Olá a todos! tenho varias divs com o mesmo ID e nome de classe. Preciso que a cor da div seja conforme uma escala de valores. Estou tentando pegar o valor pelo nome da classe, pois as divs possuem o mesmo id e não tive sucesso. Segue script: <div class="planos" id="1" value="74">74</div> <div class="planos" id="1" value="29">29</div> <div class="planos" id="1" value="55">55</div> <div class="planos" id="1" value="74">74</div> <div class="planos" id="1" value="63">63</div> <div class="planos" id="1" value="55">55</div> <script type="text/javascript"> var valueElement = document.getElementsByClassName('.planos').getAttribute('value'); console.log(valueElement); if (valueElement >= "70") { document.getElementsByClassName('.planos').style.backgroundColor == '#4caf50'; } else if (valueElement >= "50" && valueElement <= "69") { document.getElementsByClassName('.planos').style.backgroundColor == '#ffbc00'; } else { document.getElementsByClassName('.planos').style.backgroundColor == '#f44336'; } </script>
  3. rcsbnu27

    Página em html, css e javascript

    Estou tentando ajudar um amigo a desenvolver seu site pessoal ele me passou um modelo, onde não estou conseguindo fazer um link de menu quando clicar nos anos iniciais ir para as turmas dos anos iniciais no menu atividade educacionais, segue em anexo o código. Endereço para ter ideia do que estou falando: https://www.profrodrigo.com/temporario/index.html. Nesta parte: HTML <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#anosiniciais" > <img src="images/anos/anosiniciais.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#anosfinais" > <img src="images/anos/anosfinais.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div> </div> </div> <div class="section news-section" id="anosiniciais"> <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#" target="_blank"> <img src="images/turmas/pres.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#" target="_blank"> <img src="images/turmas/1sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/2sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/3sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/4sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div> <div class="section news-section" id="anosfinais"> <div class="container"> <div class="row"> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/5sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="https://www.ebmalbertostein.com" target="_blank"> <img src="images/turmas/6sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="https://www.profgarrido.com" target="_blank"> <img src="images/turmas/7sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/8sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> <div class="col-sm-2"> <a href="#"> <img src="images/turmas/9sanos.png" class="img-responsive" width="190" height="190" alt=""> </a> </div> </div> </div> </div>
  4. lezão

    Transformar table em div

    Ola pessoal! Td bem com vcs? Estou tentando fazer esse item ficar em css e naun estou conseguindo alguem pode me ajudar? <table width="75%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="15%" height="35"><b>Moda da Casa</b></td> <td width="55%" style="border-bottom: dotted; border-width: 1px 3px 3px 1px; border-color: black black #000000 #000000"></td> <td width="7%"><b>R$ 25,00</b></td> <td width="3%" rowspan="2" align="left"><img src="https://clipartart.com/images/delete-button-clipart.jpg" width="75px" heigth="50px"/></td> </tr> <tr> <td colspan="3" height="35"> <div class="label-float"> <input type="text" value="Molho de tomate, mussarela, calabresa ralada, catupiry, alho tostado, cebola, azeitonas e oregano." size="100%" placeholder="" required=""> </div> </td> </tr> </table> obrigado!
  5. lezão

    div box com texto

    Boa noite! Td bem com vcs? Meus amigos, estou precisando de um css que eu não faço ideia por onde começar ja pesquisei e nada. só encontrei como imagem, vejam. será que tem como fazer em css desse modelo, o texto tem q ficar sobreposto a cor do fundo.
  6. FabianoSouza

    Abrir aba dentro de uma DIV

    Pessoal, é possível abrir uma nova aba/janela do navegador dentro de uma DIV? Como faço? Pergunto isso porque o IFRAME não vai funcionar para o meu objetivo (já testei). Estou tentando adaptar esse código JQUERY para o Javascript puro, pra saber se a ideia funciona (não manjo de JQUERY). https://stackoverflow.com/questions/33296867/how-to-open-the-content-inside-a-div-tag-in-new-tab Grato.
  7. kaioneresm

    Abrir e fechar uma div como pou-up?

    Olá boa tarde, alguem sabe um codigo javascript facil que sirva para abrir uma div como se fosse um pou-up no centro da tela e dentro dela conter um X para fechá-la? obrigado!!
  8. E aí pessoal! Minha questão de hoje é a seguinte, ao usar o display inline-block ou inline-flex ocorre um desalinhamento dos blocos. Tentei usar outro inline, porem sem sucesso. Para melhor visualizar o que quero dizer, anexo esta uma print do resultado indesejável. Preciso que os blocos fiquem alinhados, porem ao inserir duas divs (2 e 3) no terceiro bloco ocorre o desalinhamento. Vou deixar o código para melhor entender. //==================HTML <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="./css/style.css"> </head> <body> <div class="container"> <div class="blocos">0</div> <div class="blocos">1</div> <div class="blocos"> <div class="linhas">2</div> <div class="linhas">3</div> </div> <div class="blocos">4</div> </div> </body> </html> //================== CSS @charset "utf-8"; * { margin: 0px; padding: 0px; list-style: none; resize: none; outline: none; text-decoration: none; } html, body { width: 100%; overflow-x: hidden; font-family: verdana; letter-spacing: 1.5555px; font-weight: normal; } .container { width: 100%; padding-left: 13px; background: #000; } .blocos { display: inline-block; width: 300px; height: 250px; background: #888; } .linhas { background: #f60; width: 100%; height: 122px; margin-bottom: 2px; } Agradeço desde já.
  9. Olá a todos, estou construindo um pequeno site para a empresa que eu trabalho atualmente, porém como ainda sou iniciante estou tendo algumas dificuldades, e uma delas é que eu não consigo colocar as divs lado a lado, tentei varias coisas como usar o inline e float, mas fica tudo bem bagunçado, se vocês puderem por favor dar alguma dica ou me dizer oque estou fazendo de errado. <style> * {box-sizing: border-box;} .container { position: relative; width: 50%; max-width: 300px; } .image { display: block; width: 100%; height: auto; } .overlay { position: absolute; bottom: 0; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.5); /* Black see-through */ color: #f1f1f1; width: 100%; transition: .5s ease; opacity:0; color: white; font-size: 20px; padding: 20px; text-align: center; } .container:hover .overlay { opacity: 1; } .container::after { content: ""; clear: both; display: table; } </style> <div class="titulo">Produtos</div> <p>A Gap conta com uma grande variedade de rádios e equipamentos, para atender melhor a necessidade de nossos clientes, trabalhamos com rádios moveis, portáteis e equipamentos para videomonitoramento. </p> <div class="titulo">Portáteis</div> <div class="container"> <img src="products/images/dep450.jpg" alt="rádio motorola DEP450" class="image"> <div class="overlay">Motorola DEP450</div> </div> <div class="container"> <img src="products/images/ep450.jpg" alt="rádio motorola EP450" class="image"> <div class="overlay">Motorola EP450</div> </div> <div class="container"> <img src="products/images/dgp8050.jpg" alt="rádio motorola DGP8050" class="image"> <div class="overlay">Motorola DGP8050</div> </div> <div class="titulo">Móveis</div> <div class="container"> <img src="products/images/dem300.jpg" alt="rádio motorola DGM5000" class="image"> <div class="overlay">Motorola DEM300</div> </div> <div class="titulo">Videomonitoramento</div> <div class="container"> <img src="products/images/intelbrass3330.jpg" alt="camera " class="image"> <div class="overlay">Câmera Intelbras S3330</div> </div>
  10. higordiasz

    Centrralizar e Alinhar DIVS

    Boa Tarde, Estou tendo problemas em conseguir colocar as div lado a lado alinhadas corretamente .. casso possam me ajudar ficaria grato. Segue meu código CSS responsável pelas div. .col-100 { width: 100%; float: left; position: relative; } .principal-text { background-color: #424242; } .ul-softwares { list-style-type: none; display: inline-block; height: 350; width: 90%; float: left; border: 2px solid #656565; border-radius: 15px; background-color: #373737; margin: 0 auto; } .ul-bancodedados { list-style-type: none; display: inline-block; height: 350; width: 90%; border: 2px solid #656565; border-radius: 15px; background-color: #373737; margin: 0 auto; } .ul-mobile { list-style-type: none; display: inline-block; height: 350; width: 90%; border: 2px solid #656565; border-radius: 15px; background-color: #373737; margin: 0 auto; } .ul-redeestruturada { list-style-type: none; display: inline-block; height: 350; width: 90%; float: right; border: 2px solid #656565; border-radius: 15px; background-color: #373737; margin: 0 auto; } .principal-text ul li { margin: auto; text-align: center; } .uls-principal { text-align: center; } .li-img { padding-top: 6px; } .uls-principal div { display: inline-block; width: 180; padding-right: 20px; } Abaixo meu código HTML: <div class="col-100 principal-text"> <main class="uls-principal"> <div class="div-prog"> <ul class="ul-softwares"> <li class="li-img"><img src="./img/programacao.png"></li> <li> <h1>Softwares</h1> </li> <li> <p>Possuimos diversos Softwares para a sua empresa.</p> </li> <li></li> </ul> </div> <div class="div-bd"> <ul class="ul-bancodedados"> <li class="li-img"><img src="./img/bancodedados.png"></li> <li> <h1>Banco de Dados</h1> </li> <li> <p>Organimazanos todos seus dados e configuramos oque precisa.</p> </li> <li></li> </ul> </div> <div class="div-mobile"> <ul class="ul-mobile"> <li class="li-img"><img src="./img/mobile.png"></li> <li> <h1>Desenvol. Mobile</h1> </li> <li> <p>Fazemos o aplicativo ideal para a sua Empresa.</p> </li> <li></li> </ul> </div> <div class="div-rede"> <ul class="ul-redeestruturada"> <li class="li-img"><img src="./img/rede.png"></li> <li> <h1>Estrutura de Rede</h1> </li> <li> <p>Fazemos toda o mapiamento da rede e implantação.</p> </li> <li></li> </ul> </div> </main> </div> Print das DIV: Alguem sabe oq posso alterar para alinhar elas corretamente ?
  11. geoleandro

    Abrir Divs em sequência

    <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <body> <div id="dq1"style="display:block"> <br><br> Conteúdo da Div 1 </div> <br><br> <span id = "bdq2" style="display:block" onclick = "divMostrar(2)">Próximo</span><br><br> <div id="dq2"style="display:none"> Conteúdo da Div 2 </div> <br><br> <span id = "bdq3" style="display:none" onclick = "divMostrar(3)">Próximo</span><br><br> <div id="dq3"style="display:none"> Conteúdo da Div 3 </div> <br><br> <span id = "bdq4" style="display:none" onclick = "divMostrar(4)">Próximo</span><br><br> <div id="dq4"style="display:none"> <br><br> Conteúdo da Div 4 </div> <br><br> <span id = "bdq5" style="display:none" onclick = "divMostrar(5)">Próximo</span><br><br> <div id="dq5"style="display:none"> <br><br> Conteúdo da Div 5 </div> <br><br> <span id = "bdq6" style="display:none" onclick = "divMostrar(6)">Próximo</span> <div id="dq6"style="display:none"> Terminou! </div> <script> function divMostrar(qnum){ if (document.getElementById("bdq2").style.display='block'&& qnum==2) { document.getElementById("dq2").style.display='block'; document.getElementById("bdq2").style.display='none'; document.getElementById("bdq3").style.display='block'; } if (document.getElementById("bdq3").style.display='block' && qnum==3){ document.getElementById("bdq3").style.display='none'; document.getElementById("dq3").style.display='block'; document.getElementById("bdq4").style.display='block'; } if (document.getElementById("bdq4").style.display='block' && qnum==4){ document.getElementById("bdq4").style.display='none'; document.getElementById("dq4").style.display='block'; document.getElementById("bdq5").style.display='block'; } if (document.getElementById("bdq5").style.display='block' && qnum==5){ document.getElementById("bdq5").style.display='none'; document.getElementById("dq5").style.display='block'; document.getElementById("bdq6").style.display='block'; } if (document.getElementById("bdq6").style.display='block' && qnum==6){ document.getElementById("bdq6").style.display='none'; document.getElementById("dq6").style.display='block'; } } </script> </body> </head> </html> De que outro modo é possível programar para abrir essas Divs em sequência? Além do uso de IFs e else em JavaScript.
  12. Bom dia meus Nobres amigos. Seguinte, não sou especialista em HTML, CSS, nem nada. Por isso venho humidelmente pedir uma ajudinha. Gostaria de colocar um botão nessa área marcada na imagem abaixo. Estou editando essa página abaixo: Já tentei de tudo, mexer por tudo, mas o botão não fica certo de jeito maneira. Gostaria de uma ajudinha, o botão ou ele fica em cima do texto ou não aparece de jeito algum. Vou deixar um link desse site que estou utilizando, se tiver uma alma bondosa e comtempo ai para me ajudar, eu serei eternamente grato. LINK: https://www.mediafire.com/file/fe669isyguey0ez/Intro_Viva.rar/file
  13. Meu problema é simples de entender... Tenho um DIV pai e dentro dela quero colocar varios outros blocos de DIV... O problema é que se eu deixo o DIV pai com 'display: block" então as DIV de dentro fica 1 em baixo da outra, e seu eu deixo a DIV pai com "display: flex" as DIV de dentro fica um do lado do outro infinitamente... Conclusão: Eu quero que as DIV de dentro fiquem uma do lado da outra mas sem passar do limite do tamanho da DIV pai, para que desse modo sempre que a DIV pai se ajustar ao tamanho da pagina então as DIV de dentro vão se alinhar de acordo com o espaço que tiverem. OBS: Se possivel me mandem uma solução em que não preciso usar o Bootstrap. OBS²: Se não tiver como fazer desse jeito que estou falando então podem me dizer se tem como limitar o numero de DIV por linha dentro da DIV pai? (Via CSS) Pq ai da pra eu usar o Media Queries para mudar o limite de DIVs de acordo com o tamanho da tela. EXEMPLO: <style> body { background-color: darkgray; } #pai { border: solid 2px rgb(141, 0, 0); background-color: rgb(40, 0, 104); display: flex; } .filho { border: solid 1px rgb(0, 0, 0); background-color: rgb(99, 99, 99); height: 300px; margin: 10px; max-width: 200px; min-width: 200px; } </style> </head> <body> <div id="pai"> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> <div class="filho">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa, id aliquet turpis condimentum eu. Vestibulum commodo tortor non est consequat, dapibus bibendum ligula dapibus.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis bibendum hendrerit mauris, luctus posuere arcu dapibus in. Vestibulum faucibus mi massa,</div> </body> Vlw! Flw!
  14. Olá, sou programador iniciante e tenho uma dúvida que, imagino eu, ser simples, porém não estou conseguindo achar uma solução. Seguinte: no site a seguir, preciso que "Avaliação dos Clientes" e o quadro que a segue, fiquem logo em seguida da imagem do celular (sem aquele espaço em branco entre eles). A primeira "row" possui 3 divs - a com a imagem do celular, a com o nome do modelo, preço, e avaliação com as estrelas e a div com os detalhes do produto - porém, a ultima div, ocupa o dobro do espaço vertical das demais, sendo assim, aumentando o espaço da "row" e deslocando o quadro das avaliações mais para baixo. Eu já tentei colocar a div das avaliações dentro do "row" com as 3 outras divs, porém o que acontece é apenas aumentar o tamanho da "row" de cima, mas continuar o espaço em branco que quero preencher. O que posso fazer? (peço desculpas por qualquer erro em termos técnicos). Segue abaixo as imagens de como esta / como deveria estar e as divisões das divs
  15. Mauricio Molina

    Erro em DIV

    Bom dia. Estou com um problema com uma DIV, não esta espaçando da anterior, e não estou conseguindo arrumar, acredito estar passando pequeno detalhe. Se alguém puder me dar uma força agradeço. Ainda estou limpando o código! Div em questão: <?php if ($data['imovel']->imovel_preco_condominio >0): ?> <div class="heading-title heading-title-sm bg-white"> <h2>OUTROS VALORES</h2> </div> <div class="visao"> <div class="titulo">Condomínio</div> <div class="texto"> <?= Filter::moeda($data['imovel']->imovel_preco_condominio); ?> </div> </div> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_iptu >0): ?> <div class="visao"> <div class="titulo">IPTU</div> <div class="texto"> <?= Filter::moeda($data['imovel']->imovel_preco_iptu); ?> </div> </div> <?php endif; Segue o código completo: <!DOCTYPE html> <style> .visao{ border: 5px solid #e3dfdf; width: 25%; float: left; box-sizing: border-box; margin-bottom: 60px; margin-top: 5px; } .visao-financ{ border: 5px solid #e3dfdf; width: 30%; box-sizing: border-box; margin-bottom: 60px; margin-top: 5px; margin-left: auto; margin-right: auto; } .visao-preco{ border: 5px solid #e3dfdf; width: 30%; box-sizing: border-box; margin-bottom: 60px; margin-top: 5px; margin-left: auto; margin-right: auto; } .titulo{ background: blue; color: #fff; text-align: center; font-size: 16px; } .titulo-financ{ background: blue; color: #fff; text-align: center; font-size: 20px; } .texto{ padding: 10px; text-align: center; color: black; font-size: 16px; } @media screen and (max-width: 850px) { .visao { width: 50%; } } @media screen and (max-width: 480px) { .visao { width: 50%; } } @media screen and (max-width: 480px) { .visao-preco { width: 100%; } } </style> <html lang="pt-br"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <!--SEO--> <meta name="application-name" content="<?= $data['config']->config_nome; ?>" /> <meta name="description" content="<?= $data['config']->config_seo_desc; ?>" /> <meta name="keywords" content="<?= $data['config']->config_seo_keys; ?>" /> <meta name="author" content="<?= $data['config']->config_seo_autor; ?>"> <meta name="title" content="<?= $data['imovel']->tipo_nome; ?> em <?= $data['imovel']->cidade_nome; ?> - <?= $data['imovel']->bairro_nome; ?> | <?= $data['config']->config_nome; ?>" /> <link rel="canonical" href="<?= Http::base() ?>/detalhes-do-imovel/<?= $data['imovel']->cidade_url; ?>/<?= $data['imovel']->bairro_url; ?>/<?= $data['imovel']->imovel_id; ?>" /> <link rel="shortcut icon" href="<?= Http::base() ?>/midias/icon/<?= $data['config']->config_icon; ?>"> <title><?= $data['config']->config_nome; ?></title> <meta property="og:image" content="<?= Http::base(); ?>/midias/thumb.php?zc=1&w=1400&h=768&src=fotos/<?= $data['imovel']->foto_url; ?>" /> <meta property="og:type" content="article" /> <meta property="og:description" content="<?= strip_tags($data['imovel']->imovel_descricao); ?>" /> <meta property="og:url" content="<?= Http::base() ?>/detalhes-do-imovel/<?= $data['imovel']->cidade_url; ?>/<?= $data['imovel']->bairro_url; ?>/<?= $data['imovel']->imovel_id; ?>" /> <!-- Bootstrap core CSS --> <link href="<?= Http::base() ?>/view/site/css/bootstrap.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href='//fonts.googleapis.com/css?family=Open+Sans:400,600,800' rel='stylesheet' type='text/css'> <link href="<?= Http::base() ?>/view/site/css/font-awesome.min.css" rel="stylesheet"> <link href="<?= Http::base() ?>/view/site/css/nouislider.min.css" rel="stylesheet"> <link href="<?= Http::base() ?>/view/site/css/style-<?= $data['config']->config_color; ?>.css" rel="stylesheet"> <link href="<?= Http::base() ?>/view/site/css/style-custom.css" rel="stylesheet"> <link href="<?= Http::base() ?>/view/site/css/responsive.css" rel="stylesheet"> <link href="<?= Http::base() ?>/view/site/css/style-visao.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="js/html5shiv.js"></script> <script src="js/respond.min.js"></script> <![endif]--> <?php if ($data['config']->config_ga != ""): ?> <?= $data['config']->config_ga; ?> <?php endif; ?> </head> <body> <?php require_once 'menu-topo.php'; ?> <!-- begin:header --> <div id="header" class="heading" style="background-image: url(<?= Http::base() ?>/midias/thumb.php?zcc=3&w=1024&h=768&src=contato/<?= $data['contato'][0]->contato_foto ?>);"> <?php if (Filter::check_agent('browser')) : ?> <?php require_once 'topo-busca.php'; ?> <?php endif; ?> </div> <!-- end:header --> <!-- begin:content --> <div id="content"> <div class="container"> <div class="row"> <!-- begin:article --> <div class="col-md-9 col-sm-9 col-xs-12 col-md-push-3"> <div class="row"> <div class="col-md-12 single-post"> <ul id="myTab" class="nav nav-tabs nav-justified"> <li class="active"><a href="#detail" data-toggle="tab"><i class="fa fa-university"></i> DETALHES DO IMÓVEL</a></li> <li class="hidden"><a href="#location" data-toggle="tab"><i class="fa fa-map-marker"></i> localização</a></li> </ul> <div id="myTabContent" class="tab-content"> <div class="tab-pane fade in active" id="detail"> <div class="row"> <div class="col-md-12 col-sm-12 col-xs-12"> <!-- faixa aceita financimento --> <div class="titulo-financ"><?= $data['imovel']->imovel_financ; ?></div> <!-- faixa aceita financimento --> <div id="slider-property" class="carousel slide" data-ride="carousel"> <?php $k = 0; ?> <ol class="carousel-indicators"> <?php foreach ($data['foto'] as $ims): ?> <?php if (file_exists(Http::base_dir() . DIRECTORY_SEPARATOR . "midias/fotos/$ims->foto_url")): ?> <li data-target="#slider-property" class="<?= ($k == 0) ? 'active' : '' ?>" data-slide-to="<?= $k++ ?>" > <?php if ($ims->foto_imovel): ?> <img src="<?= Http::base(); ?>/midias/thumb.php?zcc=1&w=30&h=30&src=fotos/<?= $ims->foto_url; ?>" alt="Foto" class="img-responsive" /> <?php endif; ?> </li> <?php endif; ?> <?php endforeach; ?> </ol> <div class="carousel-inner"> <?php $k = 0; ?> <?php foreach ($data['foto'] as $imf): ?> <?php if (file_exists(Http::base_dir() . DIRECTORY_SEPARATOR . "midias/fotos/$imf->foto_url")): ?> <div class="item <?php if ($k++ == 0): ?>active<?php endif; ?>"> <?php if ($imf->foto_imovel): ?> <img src="<?= Http::base(); ?>/midias/thumb.php?q=85&zc=1&w=785&h=520&src=fotos/<?= $imf->foto_url; ?>&m=marca/<?= ($data['config']->config_marca != "") ? $data['config']->config_marca : ''; ?>" alt="Foto" class="img-responsive"/></td> <?php endif; ?> </div> <?php endif; ?> <?php endforeach; ?> </div> <a class="left carousel-control" href="#slider-property" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> </a> <a class="right carousel-control" href="#slider-property" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> </a> </div> <div class="text-center"> <span class='st_facebook_large' displayText='Facebook'></span> <span class='st_googleplus_large' displayText='Google +'></span> <span class='st_linkedin_large' displayText='LinkedIn'></span> <span class='st_twitter_large' displayText='Tweet'></span> <span class='st_email_large' displayText='Email'></span> <span class='st_sharethis_large' displayText='ShareThis'></span> </div> <h1><?= $data['imovel']->bairro_nome; ?> - <?= $data['imovel']->cidade_nome ?></h1> <?= $data['imovel']->tipo_nome; ?> / Ref.: <?= $data['imovel']->imovel_ref; ?> - <?= $data['imovel']->imovel_financ; ?> <br/><br/> <div class="heading-title heading-title-sm bg-white"> <h2>PREÇO DE <?= $data['imovel']->negocio_nome; ?></h2> </div> <div class="visao-preco"> <div class="titulo">R$</div> <div class="texto"> <?php if ($data['imovel']->imovel_preco > 0): ?> <?= Filter::moeda($data['imovel']->imovel_preco); ?> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_locacao > 0): ?> <?= Filter::moeda($data['imovel']->imovel_preco_locacao); ?> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_temp > 0): ?> <?= Filter::moeda($data['imovel']->imovel_preco_temp); ?> <?php endif; ?> </div> </div> <div class="heading-title heading-title-sm bg-white"> <h2>VISÃO GERAL</h2> </div> <div class="visao"> <div class="titulo">Quarto</div> <div class="texto"> <?= $data['imovel']->imovel_dormitorio; ?> </div> </div> <div class="visao"> <div class="titulo">Banheiro</div> <div class="texto"> <?= $data['imovel']->imovel_banheiro; ?> </div> </div> <div class="visao"> <div class="titulo">Suítes</div> <div class="texto"> <?= $data['imovel']->imovel_suite; ?> </div> </div> <div class="visao"> <div class="titulo">Vaga</div> <div class="texto"> <?= $data['imovel']->imovel_vaga; ?> </div> </div> <div class="heading-title heading-title-sm bg-white"> <h2>ÁREA</h2> </div> <div class="visao"> <div class="titulo">Área</div> <div class="texto"> <?= $data['imovel']->imovel_area; ?> m<sup>2</sup> </div> </div> <div class="visao"> <div class="titulo">Área Total</div> <div class="texto"> <?= $data['imovel']->imovel_atotal; ?> m<sup>2</sup> </div> </div> <?php if ($data['imovel']->imovel_preco_condominio >0): ?> <div class="heading-title heading-title-sm bg-white"> <h2>OUTROS VALORES</h2> </div> <div class="visao"> <div class="titulo">Condomínio</div> <div class="texto"> <?= Filter::moeda($data['imovel']->imovel_preco_condominio); ?> </div> </div> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_iptu >0): ?> <div class="visao"> <div class="titulo">IPTU</div> <div class="texto"> <?= Filter::moeda($data['imovel']->imovel_preco_iptu); ?> </div> </div> <?php endif; ?> <table class="table table-bordered"> <tr> <td width="20%"><strong>Referência</strong></td> <td><?= $data['imovel']->imovel_ref; ?></td> </tr> <tr> <td><strong>Tipo</strong></td> <td><?= $data['imovel']->tipo_nome; ?></td> </tr> <tr> <td><strong>Cidade</strong></td> <td><?= $data['imovel']->cidade_nome; ?></td> </tr> <tr> <td><strong>Bairro</strong></td> <td><?= $data['imovel']->bairro_nome; ?></td> </tr> <?php if ($data['imovel']->imovel_endereco != "" && $data['imovel']->imovel_mapa == 1): ?> <tr> <td><strong>Endereço</strong></td> <td><?= $data['imovel']->imovel_endereco; ?></td> </tr> <?php endif; ?> <tr> <td><strong>Banheiro(s)</strong></td> <td><?= $data['imovel']->imovel_banheiro; ?></td> </tr> <tr> <td><strong>Quarto(s)</strong></td> <td><?= $data['imovel']->imovel_dormitorio; ?></td> </tr> <tr> <td><strong>Suíte(s)</strong></td> <td><?= $data['imovel']->imovel_suite; ?></td> </tr> <tr> <td><strong>Vaga(s)</strong></td> <td><?= $data['imovel']->imovel_vaga; ?></td> </tr> <tr> <td><strong>Área</strong></td> <td><?= $data['imovel']->imovel_area; ?> m<sup>2</sup> </td> </tr> <tr> <td><strong>Área Total</strong></td> <td><?= $data['imovel']->imovel_atotal; ?> m<sup>2</sup> </td> </tr> <tr> <td><strong>Preço de <?= $data['imovel']->negocio_nome; ?></strong></td> <?php if ($data['imovel']->imovel_preco > 0): ?> <td><?= Filter::moeda($data['imovel']->imovel_preco); ?></td> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_locacao > 0): ?> <td><?= Filter::moeda($data['imovel']->imovel_preco_locacao); ?></td> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_temp > 0): ?> <td><?= Filter::moeda($data['imovel']->imovel_preco_temp); ?></td> <?php endif; ?> </tr> <?php if ($data['imovel']->imovel_preco_condominio > 0): ?> <tr> <td><strong>Preço do Condomínio</strong></td> <td><?= Filter::moeda($data['imovel']->imovel_preco_condominio); ?></td> </tr> <?php endif; ?> <?php if ($data['imovel']->imovel_preco_iptu >0): ?> <tr> <td><strong>Preço do Iptu</strong></td> <td><?= Filter::moeda($data['imovel']->imovel_preco_iptu); ?></td> </tr> <?php endif; ?> </table> <?php if (isset($data['opcoes'][0])): ?> <br/> <div class="heading-title heading-title-sm bg-white"> <h2>CARACTERÍSTICAS</h2> </div> <div class="row"> <div class="col-md-4 col-sm-4"> <div class="row"> <ul> <?php foreach ($data['opcoes'] as $imov): ?> <?php $opc = explode(",", $data['imovel']->imovel_opcao); ?> <?php if (in_array($imov->opcao_id, $opc)): ?> <li style="list-style-type: none"><i class="fa fa-check"></i> <?= $imov->opcao_nome; ?></li> <?php endif; ?> <?php endforeach; ?> </ul> </div> </div> <?php endif; ?> </div> <?php if ($data['imovel']->imovel_descricao != ""): ?> <br/> <div class="heading-title heading-title-sm bg-white"> <h2>DESCRIÇÃO</h2> </div> <p><?= $data['imovel']->imovel_descricao; ?></p> <?php endif; ?> <br/> <div class="heading-title heading-title-sm bg-white"> <h2>LOCALIZAÇÃO</h2> </div> <div id="map"></div> </div> </div> </div> <br/><br/> <div class="heading-title heading-title-sm bg-white"> <h2>DÚVIDAS SOBRE O IMÓVEL?</h2> </div> <div class="pane"> <form role="form" method="post" enctype="multipart/form-data" action="<?= Http::base() ?>/atendimento/enviar/"> <input type="hidden" name="imovel_id" id="imovel_id" value="<?= $data['imovel']->imovel_id ?>"> <div class="form-group"> <label for="name">Nome:</label> <input type="text" name="nome" id="nome" class="form-control input-lg" placeholder="Informe o nome"> </div> <div class="form-group"> <label for="email">E-mail:</label> <input type="email" name="email" id="email" class="form-control input-lg" placeholder="Informe o e-mail"> </div> <div class="form-group"> <label for="telp">Telefone:</label> <input type="text" name="tel" id="tel" class="form-control input-lg" placeholder="Informe o telefone"> </div> <div class="form-group"> <label for="message">Messagem:</label> <textarea name="mensagem" id="mensagem" class="form-control input-lg" rows="7" placeholder="Tipo de mensagem">Olá, Gostaria de conhecer este imóvel <?= $data['imovel']->imovel_ref ?> que encontrei na <?= $data['config']->config_nome; ?>, por favor entre em contato.</textarea> </div> <div class="form-group"> <input type="submit" name="submit" value="Enviar Mensagem" class="btn btn-primary btn-lg"> </div> <div class="hide"> <input type="text" name="assunto" id="assunto" value="Informações sobre imóvel Ref. <?= $data['imovel']->imovel_ref ?> em <?= $data['imovel']->cidade_nome; ?>" /> > </div> </form> </div> </div> </div> </div> </div> <!-- end:article --> <!-- begin:sidebar --> <div class="col-md-3 col-sm-3 col-xs-12 col-md-pull-9 sidebar"> <?php if (isset($data['imovel_qt_tipo'][0])) : ?> <div class="widget widget-sidebar widget-white"> <div class="widget-header text-center"> <h4>Outros</h4> </div> <ul class="list-check"> <?php foreach ($data['imovel_qt_tipo'] as $tipo) : ?> <li><a href="#"><?= $tipo->tipo_nome; ?></a>&nbsp; (<?= $tipo->total; ?>)</li> <?php endforeach; ?> </ul> </div> <?php endif; ?> <div class="widget-sidebar widget-white"> <div class="widget-header text-center"> <h4>Imóveis Parecidos</h4> </div> <?php foreach ($data['imovel_parecido'] as $imp): ?> <div class="col-md-12"> <div class="post-container"> <a href="<?= Http::base() ?>/detalhes-do-imovel/<?= $imp->cidade_url; ?>/<?= $imp->bairro_url; ?>/<?= $imp->imovel_id; ?>/"> <?php if (file_exists(Http::base_dir() . DIRECTORY_SEPARATOR . "midias/fotos/$imp->foto_url")): ?> <img src="<?= Http::base(); ?>/midias/thumb.php?q=85&zc=1&w=280&h=180&src=fotos/<?= $imp->foto_url; ?>" alt="Foto" class="img-responsive"/> <?php else : ?> <img src="<?= Http::base(); ?>/midias/thumb.php?q=85&zc=1&w=280&h=180&src=img/sem_foto.jpg" alt="Foto" class="img-responsive"/> <?php endif; ?> </a> <h5><?= $imp->cidade_nome; ?></h5> <h6> <a href="<?= Http::base() ?>/detalhes-do-imovel/<?= $imp->cidade_url; ?>/<?= $imp->bairro_url; ?>/<?= $imp->imovel_id; ?>/"><?= $imp->tipo_nome; ?> - <span> R$ <?php if ($imp->imovel_preco != 0.00): ?> <?= Filter::moeda($imp->imovel_preco); ?> <?php endif; ?> <?php if ($imp->imovel_preco_locacao != 0.00): ?> <?= Filter::moeda($imp->imovel_preco_locacao); ?> / mês <?php endif; ?> <?php if ($imp->imovel_preco_temp != 0.00): ?> <?= Filter::moeda($imp->imovel_preco_temp); ?> / dia <?php endif; ?> </span> </a> </h6><br/> <div class="post-content"> <div class="post-meta text-center"> <span><i class="fa fa-home"></i> <?= $imp->imovel_area; ?> m<sup>2</sup> / </span> <span><i class="fa fa-hdd-o"></i> <?= $imp->imovel_dormitorio; ?> / </span> <span><i class="fa fa-male"></i> <?= $imp->imovel_banheiro; ?> wc / </span> <span><i class="fa fa-car"></i> <?= $imp->imovel_vaga; ?></span> </div> </div> </div> </div> <?php endforeach; ?> </div> </div> </div> </div> <!-- end:content --> <!-- end:footer --> <?php require_once "view/site/recentes.php" ?> <?php require_once "view/site/news.php" ?> <?php require_once "view/site/parcerias.php" ?> <?php require_once "view/site/footer.php" ?> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> <script type="text/javascript">var baseUriMap = null;</script> <script type="text/javascript">var baseUri = '<?= Http::base() ?>';</script> <script src="<?= Http::base() ?>/view/site/js/jquery.js"></script> <script src="<?= Http::base() ?>/view/site/js/bootstrap.js"></script> <script src="//maps.google.com/maps/api/js?language=pt-BR&key=<?= $data['config']->config_key_map ?>"></script> <script src="<?= Http::base() ?>/view/site/js/gmap3.min.js"></script> <script src="<?= Http::base() ?>/view/site/js/jquery.easing.js"></script> <script src="<?= Http::base() ?>/view/site/js/jquery.jcarousel.min.js"></script> <script src="<?= Http::base() ?>/view/site/js/imagesloaded.pkgd.min.js"></script> <script src="<?= Http::base() ?>/view/site/js/masonry.pkgd.min.js"></script> <script src="<?= Http::base() ?>/view/site/js/jquery.backstretch.js"></script> <script src="<?= Http::base() ?>/view/site/js/jquery.nicescroll.min.js"></script> <script src="<?= Http::base() ?>/view/site/js/nouislider.min.js"></script> <script src="<?= Http::base() ?>/view/site/js/script.js"></script> <script src="<?= Http::base() ?>/view/site/js/number.js"></script> <script src="<?= Http::base() ?>/view/site/js/main.js"></script> <script type="text/javascript"> $('#menu-home').addClass('active'); <?php if ($data['imovel']->imovel_mapa == 2) : ?> <?php $data['imovel']->imovel_endereco = $data['imovel']->bairro_nome . "," . $data['imovel']->cidade_nome; ?> <?php endif; ?> <?php if ($data['imovel']->imovel_endereco != "") : ?> $("#map").gmap3({ map: { options: { center: [<?php echo $data['imovel']->imovel_lat; ?>, <?php echo $data['imovel']->imovel_lon; ?>], address: "<?php echo $data['imovel']->imovel_endereco; ?>", zoom: 18, scrollwheel: false } }, marker<?php echo ($data['imovel']->imovel_mapa == 2) ? 's' : '' ?>: { latLng: [<?php echo $data['imovel']->imovel_lat; ?>, <?php echo $data['imovel']->imovel_lon; ?>], options: { } } }); <?php endif; ?> if ($('.carousel-indicators li').length <= 0) { $('.carousel-control').remove(); } </script> <!-- Colors DEMO Remover --> <script type="text/javascript">var switchTo5x = true;</script> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript">stLight.options({publisher: "c44b1724-22ab-4433-80d0-3328ed2847d5", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script> </body> </html> Segue a página para analise: https://gois.weblina.com.br/imobiliaria/detalhes-do-imovel/praia-grande/aviacao/23/casa-para-temporada/ No aguardo de uma luz! Obrigado!
  16. kaique nunes

    div desalinhado

    O div está desalinhado, não entendo o motivo. Há espaço suficiente pra ele encaixar, não há margin impedindo-o, seja dele proprio ou de outros divs. E estes 3 estão configurados com display: inline-block; Estou deixando o código aqui, porém é preciso abrir a tela em pelo menos 1200px para ve-lo desta maneira: https://jsfiddle.net/pjygtm2o/
  17. O negócio é o seguinte: estou criando apenas um arquivo html bem simples e básico para os atendentes utilizarem para agilizar o serviço deles em vez de inserir manualmente. Então, estou com uma dificuldade para tentar achar o problema que está ocasionando o div sumir após selecionar a segunda opção para baixo (tenta selecionar Beltrano ou Carlitos) na seleção, apenas a primeira opção Fulano está funcionando (outro detalhe: no outro arquivo que tenho segue a mesma lógica, mas é arquivo teste apenas e funciona de escolher qualquer uma das opções normalmente, mesmo sendo um arquivo-teste). Veja o código abaixo e me diz onde tá o erro que está causando?? PS: estou utilizando o Chrome apenas, a pedido da empresa. <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <title>SCRIPTS - RECEPÇÃO</title> <style type="text/css"> .carimboExecutador{ background: #ff0000; } .box{ color: #fff; padding: 20px; display: none; margin-top: 20px; } </style> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("select").change(function(){ $(this).find("option:selected").each(function(){ var optionValue = $(this).attr("value"); if(optionValue){ $(".box").not("." + optionValue).hide(); $("." + optionValue).show(); } else{ $(".box").hide(); } }); }).change(); }); function copiarTexto5() { var textoCopiado5 = document.getElementById("link5"); textoCopiado5.select(); document.execCommand("Copy"); } <!-- function copiarTexto() { --> <!-- var textoCopiado = document.getElementById("link"); --> <!-- textoCopiado.select(); --> <!-- document.execCommand("Copy"); --> <!-- } --> function selecionaAtendente() { var puxa = $( "#listaAtendente" ).val(); var str = document.getElementById("link5").value; var n = str.replace(/XX|FULANO|BELTRANO|CARLITOS/gi,puxa); document.getElementById("link5").value=n; } </script> </head> <body> <!-- DIV PARA EXIBIR LISTA DE OPÇÕES --> <div> <h4><font face="arial" color="red">ESCOLHA A SCRIPT:</font></h2> <select> <option disabled selected>Clique aqui para exibir a lista</option> <option disabled></option> <option value="carimboExecutador">Carimbo - Identificação Executador</option> </select> </div> <!-- CLASSES PARA EXIBIR DIVS SELECIONADOS --> <div class="carimboExecutador box"> <h2><font face="arial" color="white">CARIMBO - IDENTIFICAÇÃO EXECUTADOR</font></h2> <b><font face="arial" color="white">Selecione o Responsável:</font></b> <select id="listaAtendente"> <option value="FULANO">Fulano</option> <option value="BELTRANO">Beltrano</option> <option value="CARLITOS">Carlitos</option> </select> <button onclick="selecionaAtendente()">Preencher Técnico</button> <br/><textarea rows="4" cols="90" id="link5" name="link5" readonly> NOME: XX CARGO: ATENDENTE DE TELEMARKETING </textarea> <br/><button onClick="copiarTexto5()">Copiar Texto</button> </div> </body> </html>
  18. Eu estou fazendo um html com uma imagem de fundo com o atributo background e utilizei a tag div com o intuito de colocar uma imagem centralizada e dentro dessa imagem e texto, porém o texto não está sobrepondo a imagem,segue o código: <!DOCTYPE.html> <html> <head> <title>testando</title> <link rel='icon' href='favicon (2).ico' type='image/x-icon' > <meta charset=utf-8> </head> <body background="_Space Love_, de Scott Brian madeiras.jpg" > <font size="4" color="lavender" face="bradlay hand ITC regular"> <p style="text-shadow: 0.1em 0.1em 0.15em #ffffff">datas <br/> <div style="position:relative; z-index:-1 " align="center" > <img width="45%" height="1000px"src="img_como_colocar_fundo_preto_nas_fotos_16171_orig.jpg" /> </div> <div style="position:relative; z-index:1; width="100%";heght="100%" align="center"> <p align="center"style="text-shadow: 0.1em 0.1em 0.15em #ffffff "> teste </p> </div> </font> </body> </html>
  19. O negócio é o seguinte: estou criando apenas um arquivo html bem simples e básico para os atendentes utilizarem para agilizar o serviço deles em vez de inserir manualmente. Então, estou com uma dificuldade para tentar achar o problema que está ocasionando o div sumir após selecionar a segunda opção para baixo (tenta selecionar Beltrano ou Carlitos) na seleção, apenas a primeira opção Fulano está funcionando (outro detalhe: no outro arquivo que tenho segue a mesma lógica, mas é arquivo teste apenas e funciona de escolher qualquer uma das opções normalmente, mesmo sendo um arquivo-teste). Veja o código abaixo e me diz onde tá o erro que está causando?? PS: estou utilizando o Chrome apenas, a pedido da empresa. <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <title>SCRIPTS - RECEPÇÃO</title> <style type="text/css"> .carimboExecutador{ background: #ff0000; } .box{ color: #fff; padding: 20px; display: none; margin-top: 20px; } </style> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("select").change(function(){ $(this).find("option:selected").each(function(){ var optionValue = $(this).attr("value"); if(optionValue){ $(".box").not("." + optionValue).hide(); $("." + optionValue).show(); } else{ $(".box").hide(); } }); }).change(); }); function copiarTexto5() { var textoCopiado5 = document.getElementById("link5"); textoCopiado5.select(); document.execCommand("Copy"); } <!-- function copiarTexto() { --> <!-- var textoCopiado = document.getElementById("link"); --> <!-- textoCopiado.select(); --> <!-- document.execCommand("Copy"); --> <!-- } --> function selecionaAtendente() { var puxa = $( "#listaAtendente" ).val(); var str = document.getElementById("link5").value; var n = str.replace(/XX|FULANO|BELTRANO|CARLITOS/gi,puxa); document.getElementById("link5").value=n; } </script> </head> <body> <!-- DIV PARA EXIBIR LISTA DE OPÇÕES --> <div> <h4><font face="arial" color="red">ESCOLHA A SCRIPT:</font></h2> <select> <option disabled selected>Clique aqui para exibir a lista</option> <option disabled></option> <option value="carimboExecutador">Carimbo - Identificação Executador</option> </select> </div> <!-- CLASSES PARA EXIBIR DIVS SELECIONADOS --> <div class="carimboExecutador box"> <h2><font face="arial" color="white">CARIMBO - IDENTIFICAÇÃO EXECUTADOR</font></h2> <b><font face="arial" color="white">Selecione o Responsável:</font></b> <select id="listaAtendente"> <option value="FULANO">Fulano</option> <option value="BELTRANO">Beltrano</option> <option value="CARLITOS">Carlitos</option> </select> <button onclick="selecionaAtendente()">Preencher Técnico</button> <textarea rows="4" cols="90" id="link5" name="link5" readonly> NOME: XX CARGO: ATENDENTE DE TELEMARKETING </textarea> <br/><button onClick="copiarTexto5()">Copiar Texto</button> </div> </body> </html>
  20. tenho uma DIV que possui um while em php, esse while carrega 12 posts(DIV), e quero que quando acesse o site, a pagina carregue normalmente mas dentro da div aparece um loader e apenas mostre os posts quando todos estiverem carregados! isso é possivel?
  21. Olá pessoal, boa tarde. Tem alguma forma da DIV pai acompanhar a altura da ul filho? <div class="navPages-container" > <div class="container"> <nav class="navPages" style="text-align:left;"> <ul class="navPages-list"> <li class="navPages-item" style="z-index:3; width:122px;" onmouseover="mostra_fundo();" onmouseout="esconde_fundo();"><a class="navPages-action has-subMenu" href=""><i class="fa fa-list"></i> Categorias</a> <div id="menu2"> <ul class="parent-menu"> <li onmouseover="document.imgcategoria.src='https://www.vagparts.com.br/departamentos/acessorios.jpg'" onmouseout="document.imgcategoria.src='https://www.vagparts.com.br/departamentos/departamentos.jpg'"><a href="#1">Home & Kitchen</a> <div class="categoria"> <ul> <li><a href="#11">item1</a></li> <li><a href="#12" onmouseover="document.imgcategoria.src='https://www.vagparts.com.br/departamentos/acessorios.jpg'" onmouseout="document.imgcategoria.src='https://www.vagparts.com.br/departamentos/departamentos.jpg'">item2</a></li> <li><a href="#13"><i class="fa fa-list"></i> <span>Item 1</span> <i class="fas fa-angle-right" style="float:right; margin-right:10px;line-height:35px;"></i></a> <div class="subcategoria"> <ul > <li><a href="#111">item</a></li> <li><a href="#112">Even more</a></li> <li><a href="#113">item</a></li> <li><a href="#114">item</a></li> <li><a href="#115">item</a></li> </ul> </div> </li> <li><a href="#14">item4</a></li> <li><a href="#15">item5</a></li> <li><a href="#16">item6</a></li> </ul> </div> </li> #menu2{position:absolute;z-index:3;margin-top:16px; width:1170px; margin-left:-19px;background:#fff;box-shadow:0 1px 10px rgba(0,0,0,.1);border:1px solid #d0d0d0;border-radius:0 0 3px 3px; min-height:300px;display:none;font-size:14px;font-weight: bold;} .parent-menu{list-style-type:none;padding:15px 0px;width:270px;float:left;margin-top:0;position:absolute;line-height:35px;} .parent-menu li:hover{background:#ccc;cursor:pointer;} .categoria{display:none;width:270px;left:255px;line-height:35px;list-style-type:none;position: absolute;top: 15px;a {line-height: 35px;}} .categoria ul li:hover{background:#ccc;cursor:pointer;} .categoria ul{list-style-type:none;width:270px;} .categoria ul li{list-style-type:none;width:270px;} .subcategoria{display:none;width:270px;left:270px;line-height:35px;list-style-type:none;position: absolute;top: 0px;a {line-height: 35px;}} .subcategoria ul{list-style-type:none;width:270px;} .subcategoria ul li{list-style-type:none;width:270px;} .subcategoria ul li:hover{background:#ccc;cursor:pointer;} .navPages-item:hover #menu2{display:block;} .parent-menu li:hover .categoria{display:block;} .categoria ul li:hover .subcategoria{display:block;} #menu2 ul a { margin: 0px; display: block; width: 100%; height: 100%; } #menu2 ul li a { margin: 0px; display: block; width: 100%; height: 100%; }
  22. Boa noite, estou tendo a seguinte questão, estou precisando posicionar elementos (divs) um do lado do outro de forma que fiquem responsivos então os mesmos desçam em fiquem um em baixo do outro em telas menores. Ou seja, quando em tela grande de pc um do lado do outro, em telas menores móveis um em cima do outro. O recomendado pra isso seria usar float, porém preciso que ao ficar um em cima do outro os elementos fiquem centralizados na tela e a propriedade float sempre joga os elementos pra direita ou pra esquerda, não deixa ficar centralizado. Preciso então posicionar um do lado do outro sem uso de float ou encontrar outra solução, segue código abaixo. Desde já agradeço. <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="estilo.css" /> </head> <body> <div class="blocos_caracteres"> <div class="blocos_caracteres_content_1"> <p>oi</p> </div> <div class="blocos_caracteres_content_2"> <p>oi</p> </div> <div class="blocos_caracteres_content_3"> <p>oi</p> </div> <div class="blocos_caracteres_content_4"> <p>oi</p> </div> </div> </body> </html> /****reset****/ html { margin:0; padding:0; border:0; height:100%; } body { margin:0; padding:0; border:0; height:100%; } ul, ol, li {list-style:none;} /****reset****/ .blocos_caracteres {width:94%; margin: 0 auto; } .blocos_caracteres_content_1 {width:25%; height:300px; min-width: 250px; background-color: yellow; float: left; } .blocos_caracteres_content_2 {width:25% ; height:300px; min-width: 250px; background-color: green; float: left; } .blocos_caracteres_content_3 {width:25% ; height:300px; min-width: 250px; background-color: blue; float: left;} .blocos_caracteres_content_4 {width:25% ; height:300px; min-width: 250px; background-color: red; float: left;}
  23. lertanis

    Identificar inputs em uma div

    Gente eu gostaria de saber se existe alguma forma de identificar inputs dentro de uma div, sem usar nome, id ou class. Exemplo: <div> <input type='text'> <input type='text'> <input type='text> <button onclick='enviar(enviar-o-texto-do-primeiro-input, enviar-o-texto-do-segundo-input , enviar-o-texto-do-terceiro-input);>enviar</button> </div> Eu queria poder enviar os texto dos input sem usar id, class, nome, pois estou criando as div automaticamente e se botar um id para cada um, todas as outras div vão ter o mesmo id nos input.
  24. Galera, tenho um carrossel no meu arquivo, porém queria que elas mudassem aleatóriamente a cada refresh na página, pois ela s´fica pela ordem normal. <div> <div> <div class="loop owl-carousel owl-theme"> <div> <img src="imagens/jpeg.01"> </div> <div> <img src="imagens/jpeg.02"> </div> <div> <img src="imagens/jpeg.03"> </div> <div> <img src="imagens/jpeg.01"> </div> <div> <img src="imagens/jpeg.05"> </div> <div> <img src="imagens/jpeg.07"> </div> <div> <img src="imagens/jpeg.07"> </div> </div>
  25. Bom dia! Teria como alguém me ajudar? Sou bem iniciante nos códigos e acabou me surgindo uma duvida/problema a qual estou tentando resolver desde hoje cedo... Preciso criar um contêiner dentro de outro contêiner igual a imagem 1. Só que ele está ficando igual a imagem 2. Estou utilizando o bootstrap para tentar arrumar isso de uma forma que também traga a responsividade. Basicamente eu criei um container fluid e dentro dele tinha outro container, só que não estou conseguindo posicionar ambos corretamente!
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.