Ir para conteúdo

Pesquisar na Comunidade

Mostrando resultados para as tags ''Css''.

  • 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 e Banco de Dados
    • HTML e CSS
    • Java
    • Javascript
    • .NET
    • PHP
    • Python
    • Ruby
    • Mobile
    • Ambientes de Desenvolvimento
    • Arquitetura e Métodos Ágeis
    • Banco de Dados
    • DevOps
    • Desenvolvimento de Games
    • E-Commerce e Pagamentos Online
    • SEO e Otimizações
    • WordPress
    • Algoritmos & Outras Tecnologias
  • Design e Produto
    • Fotografia
    • Photoshop
    • Design de interfaces e UX
    • Edição/Produção de Vídeos
    • Marketing Online
    • Desenho, Ilustração e 3D
  • Entretenimento e uso pessoal
    • Geral
    • Segurança & Malwares
    • Gadgets e wearable
    • Softwares e Apps
    • Entretenimento

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 1180 registros

  1. WagnerFilho

    CSS - Position: Sticky

    Olá, Seguindo exatamente o exemplo abaixo, alguém pode me ajudar a trabalhar o position:sticky Hoje, a próxima data está se posicionando em cima da data atual. Desta forma, a opacidade e a sombra da data está ficando em 100%, gerando uma visão grotesca, caso haja muitas datas. Eu quero que a data anterior, suba com o scroll e dê lugar para a próxima data. Se eu adicionar a data e os diálogos em um container, dá certo, porém, preciso trabalhar com o que tenho abaixo. Javascript também é aceito para este trabalho o que tenho até agora jsfiddle <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title></title> <meta name="description" content="sticky"> <meta name="viewport" content="width=device-width"> </head> <body> <div class="chat"> <div class="data">05/03/2019</div> <div class="box recebido">Olá</div> <div class="box enviado">Oi, tudo bem ?</div> <div class="data">06/03/2019</div> <div class="box recebido">Tudo bem!</div> <div class="box recebido">e voce ?</div> <div class="box enviado">Tudo bem tambem</div> <div class="box recebido">preciso de ajuda</div> <div class="box recebido">Voce pode me ajudar</div> <div class="data">07/03/2019</div> <div class="box enviado">Talvez sim</div> <div class="box enviado">O que voce precisa</div> <div class="box recebido">Como posso utilizar o position:sticky ?</div> <div class="box enviado">Deixe-me ver</div> <div class="box enviado">Acho que posso te ajudar</div> <div class="box recebido">Certo</div> </div> </body> <style> * { margin: 0px; padding: 0px; } .chat { overflow: auto; border: solid 1px black; position: fixed; left: 50%; top: 50%; background-color: #e5ddd5; z-index: 100; height: 500px; margin-top: -200px; width: 500px; margin-left: -300px; } .box { width: 300px; margin: 30px auto; padding: 20px; text-align: center; font-weight: 400; color: black; font-family: arial; position: relative; border-radius: 20px; } .box.enviado { background: #dcf8c6; } .box.recebido { background: white; } .recebido:before { content: ""; width: 0px; height: 0px; position: absolute; border-left: 10px solid white; border-right: 10px solid transparent; border-top: 10px solid white; border-bottom: 10px solid transparent; left: 19px; bottom: -19px; } .enviado:before { content: ""; width: 0px; height: 0px; position: absolute; border-left: 10px solid transparent; border-right: 10px solid #dcf8c6; border-top: 10px solid #dcf8c6; border-bottom: 10px solid transparent; right: 19px; bottom: -19px; } .data { background-color: rgba(225, 245, 254, 0.92); color: rgba(69, 90, 100, 0.95)!important; padding: 5px 12px 6px 12px!important; border-radius: 7.5px!important; box-shadow: 0 1px 0.5px rgba(0, 0, 0, 0.13)!important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4)!important; margin-bottom: 8px!important; margin-top: 8px!important; margin-right: auto!important; margin-left: auto!important; max-width: 75px; opacity: 0.8; z-index: 2; } .data { top: 10px; position: sticky; } </style> </html>
  2. joaon77@yahoo.com.br

    Lista não ordenada (ul) com imagens - duplicação de imagem

    Olá pessoal! Criei um menu usando listas não ordenadas (ul, li) com as imagens dispostas horizontalmente. São quatro imagens. O problema é que uma das imagens aparece duplicada no layout. Não entendi. Segue o código: ... <span class="menuRedesSociais"> <ul> <li id="img1"><a href="#"</a></li> <li id="img2"><a href="#"></a></li> <li id="img3"><a href="#"></a></li> <li id="img4"><a href="#"></a></li> </ul> </span> span ul { margin: 0; padding: 0; } span li { list-style: none; display: inline-block; } span a:link, a:visited { padding: 15px; } li#img1 a{ background-image: url("#img1"); background-repeat: no-repeat; } li#img2 a{ background-image: url("#img2"); background-repeat: no-repeat; } li#img3 a{ background-image: url("#img3"); background-repeat: no-repeat; } li#img4 a{ background-image: url("#img4"); background-repeat: no-repeat; } A imagem que aparece duplicada é a img2. Obs. Já fiz o teste trocando a posição das imagens, só que o problema continua. Agradeço muito se alguém puder me ajudar.
  3. marcosrosario

    Quero colocar um scroll em pagina HTML + CSS

    Eu estou fazendo uma página para faculdade que só pode ser usado HTML e CSS, e nessa página eu gostaria de ter um scrolls, Porém, ao invés de usar o scroll do mouse, usar um botão dentro da própria página levando ela ao conteúdo desejado. No caso, a página seria uma só e teriam algumas camadas, a camada da página inicial que conteria todos os botões levando a todas as outras camadas, camada de baixo com algum conteúdo, outra camada com outro conteúdo... Como posso fazer? Além de querer saber como criar os scrolls, queria saber como criar backgrounds separados, página inicial de uma cor, conteúdo de outra, assim como no site. Desde já, agradeço. Site de exemplo: arcadis
  4. rodrigoalgeri

    IMAGEM CSS

    BOA NOITE OLHA ISSO onde esta escrito isso aqui "Health star ratings Kellogg reveals the cereal Rodrigo Algeri", tem uma pequena imagem em cima se voce perceber ela e uma imagem redonda so que nao aparece inteira voce sabe algum jeito pra aparecer ? tipo ela tem que ficar 75px altura e largura a altura fica, so que ela corta, EU GOSTARIA QUE FICASSE UM QUADRADO TIPO 75PX X 75PX E ISSO E PRA FICAR EM TODAS ESSAS IMAGENS AI QUE TEM
  5. Gustavo2503

    Função dentro de função

    Eu estou criando uma classe que cria modais usando React, eu preciso criar um modal dentro de um modal, para isso, eu quero chamar a mesma função dentro dela mesma. O modal é criado, mas o problema é que ele não abre, abre o modal principal (#modal-1), mas não abre o sub modal (#modal-2), veja como ficou meu código: index.html <!DOCTYPE html> <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"> <title>Modal</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script> <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script> <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script> <script src="js/modal.js" type="text/babel"></script> <link rel="stylesheet" href="css/modal.css"> </head> <body> <div align="center"> <h1>Modal</h1> </div> <button type="button" data-modal="modal-1">Open Modal</button> <div id="modal-content"></div> <script type="text/babel"> const contentSub = [ <h2>Title SubModal 1</h2>, <p>SubModal</p>, <small>Rodapé submodal 1</small> ]; const idSub = "modal-2"; const content = [ <h2>Title 1</h2>, <section> <button type="button" data-modal="modal-2">Open SubModal</button> <Modal id={idSub} content={contentSub}/> </section>, <small>Rodapé 1</small> ]; const id = "modal-1"; ReactDOM.render( <Modal id={id} content={content}/>, document.getElementById('modal-content') ); </script> </body> </html> js/modal.js class Modal extends React.Component{ constructor(props) { super(props); this.id = this.props.id; this.backgroudColorHeader = this.props.backgroudColorHeader === undefined ? 'rgba(103, 117, 240, 1)' : this.props.backgroudColorHeader; this.textColorHeader = this.props.textColorHeader === undefined ? '#fff' : this.props.textColorHeader; this.backgroudColorBody = this.props.backgroudColorBody === undefined ? 'rgba(255, 255, 255, 1)' : this.props.backgroudColorBody; this.textColorBody = this.props.textColorBody === undefined ? '#000' : this.props.textColorBody; this.backgroudColorFooter = this.props.backgroudColorFooter === undefined ? 'rgba(103, 117, 240, 1)' : this.props.backgroudColorFooter; this.textColorFooter = this.props.textColorFooter === undefined ? '#fff' : this.props.textColorFooter; this.borderRadius = this.props.borderRadius === undefined ? '8px' : this.props.borderRadius; this.content = this.props.content === undefined ? [<h2>header content</h2>, <p>body content</p>, <p>footer content</p>] : this.props.content; this.size = this.props.size === undefined ? 3 : this.props.size; } closeModal = () => { $('#'+this.id).removeClass("show"); $('body').removeClass("overflow-hidden"); }; render(){ $(`[data-modal]`).click( function () { var id = $(this).attr("data-modal"); var el = document.getElementById(id); $(el).addClass("show"); $('body').addClass("overflow-hidden"); }); var background, text; background = this.backgroudColorHeader; text = this.textColorHeader; const transparencyBackgroundHeader = background.substring(background.length-2,background.length-1) -.1; const backgroundColorHeader = `${background.substring(0,background.length-2)}${transparencyBackgroundHeader})`; const styleColorHeader = { backgroundColor: backgroundColorHeader, color: text, borderBottom: `1px solid ${background}` }; background = this.backgroudColorBody; text = this.textColorBody; const styleColorBody = { backgroundColor: background, color: text }; background = this.backgroudColorFooter; text = this.textColorFooter; const transparencyBackgroundFooter = background.substring(background.length-2,background.length-1) -.1; const backgroundColorFooter = `${background.substring(0,background.length-2)}${transparencyBackgroundFooter})`; const styleColorFooter = { backgroundColor: backgroundColorFooter, color: text, borderTop: `1px solid ${background}` }; const styleBorderRadius = {borderRadius: this.borderRadius}; const eDivision = ['h', 'b', 'f']; const eContent = this.content; var div = []; for (var i=0;i<eContent.length;i++){ const part = eDivision[i].replace('h', 'header').replace('b', 'body').replace('f', 'footer')+"-modal"; const closeModal = i === 0 ? <span onClick={this.closeModal} className="close-modal"><i className="material-icons">close</i></span> : "" ; var style; if (i===0) style = styleColorHeader; else if (i===1) style = styleColorBody; else style = styleColorFooter; div.push(<div key={i+1} className={part} style={style}> {closeModal} {eContent[i]} </div>); } const eSize = this.size; const s = ['s', 'm-s', 'm', 'm-l', 'l']; const size = s[eSize-1]; const classModal = (size !== "s" && size !== "m-s" && size !== "m" && size !== "m-l" && size !== "l") ? 'modal-modal modal-m' : "modal-modal modal-"+size; return <div id={this.id} className={classModal}> <div className="overflow-modal"> <div className="container-modal" style={styleBorderRadius}> {div} </div> </div> </div>; } }
  6. gustavopc123

    Formulário de contato com html e css

    Meu site diyjogos fiz com html e css, e acho parece que está faltando alguma coisa, alguém poderia me auxiliar, minha dúvida é se da pra fazer um formulário de contato com html e css e que realmente funcione (Obs: Não tenho hospedagem é tudo com codigos, sem php) Alguem poderia me ajudar ? Da uma olhada no site por favor.
  7. VCastilho

    Criação de um Filtro Inteligente

    Boa Tarde Estou tentando desenvolver um Filtro Inteligente, no qual funcionaria da seguinte forma: Filtro 1 Filtro 2 Filtro 3 Filtro 4 Opção 1 Opção 2 Opção 3 Ao selecionar a Opção 1 do Filtro 1 liberaria as opções do filtro 2 Filtro 1 Filtro 2 Filtro 3 Filtro 4 Opção 1 Opção 1 - a Opção 1 -b Opção 1 -c Assim escolhendo a opção do filtro 2 liberaria as opções do Filtro 3 e assim por diante Ao escolher a Opção 2 do Filtro 1 liberaria outras opções No caso preciso aplicar na plataforma da Tray, que é o de menos porém não consigo chegar ao código certo Estou tentando utilizar o HTML e o JQuery em conjunto para isso, conseguem me ajudar? Realmente estou perdido na situação Atenciosamente Vinicius Castilho
  8. Tenho um site, cujo aparece uma barra na parte de cima quando é rolado para baixo, minha questão é, que comando uso para essa barra desaparecer, segue o site: www.blucelularescdr.com.br Grato!!
  9. isaque_cb2

    botstrap erro com imagem

    Olá galera, eu estou trabalhando em um site pessoal, mais para aprendizado mesmo, mas me deparei com um erro, quando eu abro o site no navegador (PC) funciona normal, mas quando abro no celular, a imagem dica pequena e no topo, alguém pode me ajudar com isso? print 1: (modo mobile do inspecionar) no PC fica normal, repare a área cinza abaixo da imagem, toda essa área devia ser coberta pela imagem, grato! http://prntscr.com/mvj3ed Grato desde já!
  10. Jorge Euldes

    Página para Gerar Crachás

    Boa tarde galera, Estou com o seguinte problema, tô criando uma página em que essa página o usuário escolhe um arquivo do pc, que será o layout do seu crachá, o layout aparece na tela sem texto nenhum e o usuário pode colocar tags como: {{nome}} {{funcao}} e etc. Só que não tem idéia de como fazer pra "editar" esse arquivo pela página, ou seja colocar os dados que ele digitar no layout do crachá. Não sei se é possivel editar esse arquivo png(ou psd), já pesquisei muito a respeito e não achei uma solução parar gerar esses crachás. Não precisa me dar algum código pronto, quero pelo menos uma luz, uma ferramenta que seja possível fazer isso. Obrigado!
  11. Blasius

    Imagem no mozila

    Olá, sou ainda um garfanhoto. estou com um problema de imagem quando abro no mozila, outros navegadores fica normal. Achei que o comando // -moz-box-sizing: border-box; // iria resolver mas não. MOZILA ########################################################################## CHROME ############################################################## Se alguém puder me dar uma luz eu agradeço, abraço ! HTML <figure class="foto-legenda"> <img src="_imagens/glass-quadro-homem-mulher.jpg"/> <figcaption> <h3>Google glass o mundo aos seus olhos!<h3/> <p> by: caixa d' agua </p> </figcaption> </figure> CSS /* Formatação de imagens com legendas */ figure.foto-legenda { position: relative; border: 4px solid white; box-shadow: 2px 2px 4px black; max-width: 500px; max-height: 281px; } figure.foto-legenda img { width: 100%; height: 100%; } figure.foto-legenda figcaption{ opacity: 0; position:absolute; top: 0px; background-color: rgba(0,0,0,.4); color: white; width: 100%; height: 100%; padding: 10px; box-sizing: border-box; -moz-box-sizing:border-box; transition: opacity 1s; } figure.foto-legenda:hover figcaption { opacity: 1; }
  12. explosivemineyt

    Erro no CSS do formulário

    Bom dia, Eu encontro-me a tentar realizar um formulário login do tipo google, mas apesar de estar a funcionar, por vezes quando recarrego a pagina aparece assim e tenho que carregar na pagina ou no campo ou outro local qualquer para atualizar. Gostaria de conseguir corrijir mas apesar de pesquisar não encontro como corrijir. o meu código html: Meu código css: Meu bootstrap.css(ficheiro muito grande, posso disponibilizar por um drive ou algo do genero) bootstrap versão v4.0.0
  13. mateumt15

    Tabela com linha muito grande

    Tenho uma tabela com muitas linha e uma dessas linha e muito grande, ja tentei varias coisas para arrumar mas nenhuma delas deu jeito nisso segue a tabela <div class='wrapper-modal-editor'> <div class='block my-4'> <div class='d-flex justify-content-center'> </div> </div> <table id='dtBasicExample' class='table table-striped table-bordered table-responsive'> <thead> <tr> <th class='th-sm'>Id Link </th> <th class='th-sm'>Link </th> <th class='th-sm'>Data Inicio </th> <th class='th-sm'>Data Fim </th> <th class='th-sm'>Ação </th> <th class='th-sm'>Dominio </th> <th class='th-sm'>Seleção </th> </tr> </thead> <div> <script src='../js/jquery-3.2.1.min.js'></script> <script src='../js/popper.min.js'></script> <script src='../js/bootstrap-4.0.0.js'></script> </div> </div> <tbody> <tr> <td>27</td> <td>c.apple.com/r?v=2&amp;la=pt&amp;lc=bra&amp;a=z2%2Bnb8HWCoHziyJtbRYNxDd%2FkgyZjZvGSC81JOPXnypgazdDEpi9VZFGWHLJPWmuLtv6bjDTIDHd4zoATogPVtQ0TnXoWLHI2XQ1aVDI5YpHS0D4qfYHYB09Aq0qVHjRe8TR8%2Fo56d7spUwxrFdNL9jusvKWFiLfJBTgZkKsbI4pWRAyzrFaNxkIWNXu%2Fakj&amp;ct=aI3g7L0A3k</td> <td>...</td> <td>...</td> <td>...</td> <td>...</td> <td>...</td> <td>...</td> </tr> </table>
  14. LuanMartinsTI

    Problema com Plugin de Textarea Tinymce

    Bom dia pessoal, eu estou precisando implementar um plugin de textarea em um site, e ele precisa ter o editor de codigo, exatamente como o do forum, uma parte onde voc'e edita um trecho de codigo em determinada linguagem, ate ai tudo bem, o meu funciona corretamente, ai eu clico em inserir trecho de codigos ele aparece lindo, diferenciando cores de tags e tudo mais como se fosse um editor de texto mesmo, netbeans vs entre outros, mas quando eu posto a noticia o codigo fica apenas cinza como se fosse comentado, eu vou colocar o link das duas imagens pra voc"es entenderem, se alguem souber oq pode ser vai me ajudar muito, eu tentei verificar o inspecionar elemento para ver as tags q eram criadas mas nao criava tags entao estou meio confuso se nao eu mesmo estilizaria as tags, mas como nao cria nao sei oq fazer. imagem 1 https://prnt.sc/mt64zk imagem 2 https://prnt.sc/mt65ca eu n'ao sei se [e pribido postar imagens aqui, entao me desculpem se nao puder, mas em todo caso eu implementei todos os JS e CSS do plugin nas duas paginas, na que escreve a noticia e na que abre a noticia
  15. pewty

    zoom in html

    hey, eu queria um código que quando o utilizador passa-se com o rato por cima da imagem fizesse um zoom in tal como aqui -> https://codepen.io/nxworld/pen/ZYNOBZ?editors=1100 não sei porquê não consigo adicionar esse código para fazer com que funcione. ajuda seria bem vinda, obrigado :) código sobre as imagens atual: <div class="w3-row-padding w3-center w3-light-grey"> <div class="w3-third"> <p><b>5D</b></p> <figure><img src="5dseries/5dmkiv.png" alt="Random Name" style="width:50%;height:50%"></figure> <p><b><span>2,999.00 </span></b></p> </div> <div class="w3-third"> <p><b>1D</b></p> <figure><img src="1dseries/1dxmk3.png" alt="Random Name" style="width:50%;height:50%"></figure> <p><b><span>$5,499.00</b></p></span> </div> <div class="w3-third"> <p><b>6D</b></p> <figure><img src="6d/6d1.png" alt="Random Name" style="width:50%;height:50%"></figure> <p><b><span>$1,499.00</span></b></p> </div> </div>
  16. Carcleo

    Dificuldades com FlexBox e UL

    Pessoal, estou com uma dúvida que está me tirando o sono! Então, vou exibir 2 situações com Flexbox onde 1 delas está dando uma falha. (Será mesmo?). Nessa versão, com DIV's, tudo funciona bem: CSS: span.vertical { writing-mode: vertical-lr; transform: rotate(180deg); } span.comum { } div.cabecalhoVertical{ display: flex; height: 200px; border: .1px rgb(0,0,0) solid; } div.cabecalhoVertical div { display: flex; flex-grow: 1; list-style: none; border-right: .1px rgb(0,0,0) solid; align-items: center; justify-content: center; } div.cabecalhoVertical div span { text-align: center; font-weight: bolder; } HTML: <div class='cabecalhoVertical'> <div style='width:215px;'><span class='comum' >Nome do Gcéu </span></div> <div style='width:215px;'><span class='vertical'>Supervisor</span></div> <div style='width:215px;'><span class='comum' >Líder</span></div> <div style='width:035px;'><span class='vertical'>Houve Supervisão?</span></div> <div style='width:035px;'><span class='vertical'>Houve dia de Jejum?</span></div> <div style='width:035px;'><span class='vertical'>Houve dia de Evangedismo?</span></div> <div style='width:035px;'><span class='vertical'>Membros Compromissados</span></div> <div style='width:035px;'><span class='vertical'>Visitantes</span></div> <div style='width:035px;'><span class='vertical'>Crianças de 0 à 12 anos</span></div> <div style='width:035px;'><span class='vertical'>Total de presentes</span></div> <div style='width:035px;'><span class='vertical'>Ofertas</span></div> <div style='width:035px;'><span class='vertical'>Disicpulados</span></div> <div style='width:035px;'><span class='vertical'>Número de decisões</span></div> </div> Resultado: Agora com UL -> A falha: CSS: span.vertical { writing-mode: vertical-lr; transform: rotate(180deg); } span.comum { } ul.cabecalhoVertical{ display: flex; height: 200px; border: .1px rgb(0,0,0) solid; } ul.cabecalhoVertical li { display: flex; flex-grow: 1; list-style: none; border-right: .1px rgb(0,0,0) solid; align-items: center; justify-content: center; } ul.cabecalhoVertical li span { text-align: center; font-weight: bolder; } HTML: <ul class='cabecalhoVertical'> <li style='width:215px;'><span class='comum' >Nome do Gcéu </span></li> <li style='width:215px;'><span class='vertical'>Supervisor</span></li> <li style='width:215px;'><span class='comum' >Líder</span></li> <li style='width:035px;'><span class='vertical'>Houve Supervisão?</span></li> <li style='width:035px;'><span class='vertical'>Houve dia de Jejum?</span></li> <li style='width:035px;'><span class='vertical'>Houve dia de Evangedismo?</span></li> <li style='width:035px;'><span class='vertical'>Membros Compromissados</span></li> <li style='width:035px;'><span class='vertical'>Visitantes</span></li> <li style='width:035px;'><span class='vertical'>Crianças de 0 à 12 anos</span></li> <li style='width:035px;'><span class='vertical'>Total de presentes</span></li> <li style='width:035px;'><span class='vertical'>Ofertas</span></li> <li style='width:035px;'><span class='vertical'>Disicpulados</span></li> <li style='width:035px;'><span class='vertical'>Número de decisões</span></li> </ul> Percebam agora na print como aparece um bloco adicional no lado esquerdo antes da primeira LI Gostaria de saber 2 coisas: 1) Porquê isso acontece uma vez que list-style está setado para none nas LI's? 2) Como corrigir essa falha? Obrigado a quem puder ajudar.
  17. wesleyexee

    Menu JavaScript

    /* Navegação visível no Scroll */ mainNav(); $(window).scroll(function () { mainNav(); }); function mainNav() { var top = (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop; if (top > 40) $('.menuInvisivel').stop().animate({ "opacity": '1', "top": '0' }); else $('.menuInvisivel').stop().animate({ "opacity": '0.3', "top": '0' }); } PORQUE QUANDO EU SUBSTITUO O OPACITY POR BACKGROUND NÃO FUNCIONA /* Navegação visível no Scroll */ mainNav(); $(window).scroll(function () { mainNav(); }); function mainNav() { var top = (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop; if (top > 40) $('.menuInvisivel').stop().animate({ "background": 'white', "top": '0' }); else $('.menuInvisivel').stop().animate({ "background": 'transparent', "top": '0' }); } queria substituir para que ele fique transparente meu menu e não invisível.
  18. Bom pessoal, estou tendo problema para colocar uma imagem de backgroung no corpo do meu texto, especificamente no h1. Estou desenvolvendo o codigo no bloco de notas mesmo e estou separando o html do css em dois arquivos de notas diferentes. abaixo está meu arquivo em html: <! doctype html> <html> <head> <meta charset="utf-8"> <title>Sobre a Mirror Fashion</title> <link rel= "stylesheet" href="C:\Marko\Tec. informatica\FrontEnd\Projetos\lojamirrorfashion\css/sobre.css.css"> </head> <body> <img src="C:\Marko\Tec. informatica\FrontEnd\Projetos\pacote do html - Caelom curso\mirrorfashion\img/logo.png"> <h1> A Mirror Fashin</h1> ... Já está apontando para o arquivo css devido. Algumas formatações já consegui fazer. Mas nao estou conseguindo por a imagem de background no texto referente ao h1. já especifiquei centenas de vezes a pasta de caminho mas a imagem nao aparece. css: body { color: #333333; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; } >> h1 { >> background-image: url(C:\Marko\Tec. informatica\FrontEnd\Projetos\pacote do html - Caelom curso\mirrorfashion\img/sobre-background.jpg); } h2 { border-bottom: 2px solid #333333; } figure { background-color: #F2EDED; border: 1px solid #ccc; text-align: center; } ... Voces conseguem ver o problema?
  19. Marcus Vinicius SM

    Estou com um problema de link da play.google

    Boa tarde estou com um problema com este comando <div class="home-content__btn-wrap"> <a href="http://bit.ly/agendanimal-android" onClick="dialogFiltro('2');" class="btn btn--primary home-content__btn button round large"> Baixe o aplicativo</a> </div> <div class="home-content__btn-wrap"> <a href="https://play.google.com/store/apps/details?id=com.ionicframework.dpvet189491&hl=pt" onClick="dialogFiltro('2');" class="btn btn--primary home-content__btn button round large"> Baixe o aplicativo!</a> </div> realizei destas duas maneiras porem somente no meu domínio (.COM) o button realiza a a função esperado que me leva a play.google e nos meu dominios (.COM.BR) ela não funciona agendaanimal.com.br agendanimal.com.br agendaanimal.com agendanimal.com
  20. Artes Ussler

    Números de telefones marcados

    Bom dia Alguns navegadores sublinham ou trocam a cor dos números de telefones que estão no site. Como faço para remover isso? Se alguém puder ajudar, eu fico grato.
  21. nilo7004b

    Manchas em background de pagina HTML

    Ola pessoal, sou novo aqui no fórum e desculpem qualquer erro, já procurei bastante pelo meu problema e não consegui encontrar nada a respeito. O meu problema é que eu estou desenvolvendo uma pagina web e após definir o background como um gradiente e adicionar divs aparecem umas manchas brancas pela pagina que vão alterando de posição a medida em que vai fazendo scroll na pagina, na imagem anexada tem o exemplo, gostaria de saber qual a origem do problema e como resolver. Desde já agradeço pela ajuda. Obs.: as DIVs adicionadas não estão com a cor de background definida.
  22. Obs: Esse tópico tem relação com esse aqui tava tentando fazer com base nele mas não consegui e abri esse. Bem galera tô querendo fazer uma movimentação na div, que quando o scroll chegar a determinado ponto quero que a div mude seus atributos CSS tipo o campo de busca desse site quando rola o scroll até determinado ponto ele sobe... meus html, css e js <div class="busca"> <form name="form_busca" action="busca.php"> <input type="text" name="buscar" placeholder="Buscar supermercado, pizzaria, armazém e etc..." required=""/> <button class="btnbusca">BUSCAR</button> </form> </div> .fix-nav-menu { background: #ff0000; margin: 5px 300px; z-index: 1; position: fixed; } .stop-nav-menu { z-index: 1; } .busca{position: absolute;float: left;margin:275px 300px;width: 580px;height: auto;background: #FFFFFF;border-radius: 5px;} <script type="text/javascript"> $("document").ready(function($){ var nav = $('.busca'); $(window).scroll(function () { /* Caso a barra de rolagem seja maior do que 60 e menor do que 800, irá adicionar ao elemento a classe que irá fixa-lo */ if ($(this).scrollTop() > 60 && $(this).scrollTop() < 800) { nav.addClass("fix-nav-menu"); } /* Caso a barra de rolagem seja maior do que 800, irá adicionar ao elemento a classe que irá torna-lo absoluto, e irá alterar o posicionamento superior para 800px */ else if ($(this).scrollTop() > 800) { nav.removeClass("fix-nav-menu"); nav.addClass("stop-nav-menu"); } /* Caso nenhuma das expressões acima sejam verdadeiras, o elemento voltará ao seu estado normal */ else { nav.removeClass("fix-nav-menu"); nav.removeClass("stop-nav-menu"); } }); }); </script> aí tipo com esses códigos ele tá inserindo a classe mas não tá substituindo as atribuições no CSS(Em anexo)
  23. Luiz Fernando 111

    Projeto da faculdade

    Caros amigos, estou tentando adicionar soma entre inputs do html e do javascript, mas com esse exemplo, apenas consegui colocar no input do html. Como faço para implementar no input do javascript e somar o valor junto com o Valor Total mostrar lucro quando foi debito e prejuizo quando for crédito ? Alguém poderia me dá help !!!
  24. mpcarvalho

    Marca de seleção ao clicar em link

    Estou com uma dúvida e revirei o forum e a internet e não achei solução. Criei um template em HTML para um APP hibrido, porem quando utilizado na versão mobile, ao clicar em qualquer link aparece uma marca de seleção antes de mudar de página. Gostaria de saber como remover isso. Segue imagens para explanar melhor minha dúvida.
  25. Robson Augusto

    Meu Site não aparece em Resultados de pesquisa no PC

    Galera se alguém souber o que ocorre, é o seguinte, não acredito que possa ser Problema de SEO, mas vamos lá meu site anuncicarbh.com, não aparece em pesquisa feitas pelo computador, com a palavra chave "seminovos bh", ele aparece na primeira oscilando para segunda pagina do bing e yahoo, fazendo a pesquisa pelo telefone, ja no pc ele nao aparace mais no yahoo, mas continua a aparecer no bing, ja no google ele teve pequenas aparições na terceira página, agora em ambas as pesquisas de pc e celular ja não aparece mais no google... So aparece atualmente no google, pesquisando pelo nome do site... Alguem saberia me dizer o por que disso? será SEO?
×

Informação importante

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