Ir para conteúdo

Pesquisar na Comunidade

Mostrando resultados para as tags ''hover''.

  • 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 17 registros

  1. Olá pessoal tudo bem ? Gostaria de adicionar uma borda a um objeto passando o mouse em cima do mesmo usando o parâmetro hover sem que alterasse a posição dos outros ao lado ( sem ficar tremendo o layout) abaixo está o código. Alguém consegue me dar uma ajuda ? <html> <head> <title></title> <style type="text/css"> .quadrado{ width: 100px; height: 100px; background-color: grey; display: inline-block; margin:2px; } #container{ width: 320px; } .quadrado:hover{ border: 4px solid black; box-sizing: border-box; } </style> </head> <body> <div id="container"> <div class="quadrado">Primeiro</div> <div class="quadrado">Segundo </div> <div class="quadrado">Terceiro </div> <div class="quadrado">Quarto</div> <div class="quadrado">Quinto</div> <div class="quadrado">Sexto</div> <div class="quadrado">Sétimo</div> <div class="quadrado">Oitavo</div> <div class="quadrado">Nono</div> </div> </body> </html>
  2. Clovis Alberto Block

    Hover com tamanhos diferentes no menu principal e submenus

    Olá amigos, Baixei o código de um "mega menu" e passei a adapta-lo às minhas necessidades. O problema que não consigo resolver é acertar os tamanhos do hover, nos menus secundários está ok, porem no menu principal o hover está maior do que cada item de menu, executando o código é fácil perceber, basta navegar no menu principal que o problema já é percebido. Tenho a impressão que o menu principal "herdou" dos menus secundários o tamanho do hover. Gostaria de deixar o tamanho do hover no menu principal proporcional ao comprimento de cada texto. Estou anexando os arquivos, inclusive nos mesmos deixei minhas tentativas de acerto em forma de comentários. Sou novo em HTML/CSS, então se virem código ruim, fiquem à vontade para opinar. Por favor, expliquem como se eu tivesse 08 anos rsrsrsr... P.S: Como faço para anexar meus arquivos fonte html e css3? Desde já agradeço. Clovis Alberto Block
  3. FabianoSouza

    Exibir/esconder checkbox dentro de TD/TR usando hover

    Toda 1ª TD da TR tem um checkbox. Quero que, ao passar o mouse sobre a TR (ou qualquer TD da TR) o checkbox seja exibido. E depois, ao sair da TR, o checkbox volte o seu estado original (oculto). Isso não está funcionando... input[type=checkbox] fieldset[id="atividades-candidato"]table tr td:hover{ display:inline; }
  4. Ander de Assis

    ícones menu HTML

    BOA NOITE PESSOAL, ESTOU CRIANDO UM SITE E SOU BEM LEIGO AINDA PODERIAM ME AJUDAR? QUERO COLOCAR ÍCONES NO MENU AO INVÉS DE ESCREVER! PESQUISEI NA INTERNET O COMANDO SPAN QUE SERIA POSSÍVEL EXECUTAR ESSA AÇÃO, POREM NÃO ESTA FUNCIONANDO EM NENHUM DOS NAVEGADORES. SOMENTE O MOZILA QUE RECONHECE O COMANDO "HOVER" O CHROME E EXPLORE NÃO RECONHECE O HOVER E NEM SPAN. SE PODEREM ME DAR UMA FORÇA O CODIGO ESTA LOGO A BAIXO.. OBRIGADO!! ARQUIVO HTML <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <title>WA STORES</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div id="logo"> <img src="C:\Users\Anderson\Desktop\wa\img\wa stores.png"/> </div> <div id="menu"> <ul> <li><span class="face"></span><a href="#">home</a></li> <li><a href="#">home</a></li> <li><a href="#">home</a></li> </ul> </div> </body> </html> ===================================================================================== ARQUIVO CSS @charset "UTF-8"; *{margin: 0;padding: 0;} #logo{position: absolute; left: -480px; top: -200px;} #menu {width: 100%; height: 60px; background: #000000 ; margin: 0; float: left;}/* fundo menu */ #menu ul {float: left; list-style: none; margin: 0; padding: 0; width: 100%; } /* posição menu left right*/ #menu ul li {float: left; font: 16px roboto;}/* posição menu top low */ #menu ul li:hover {background: #eee;} #menu ul li a { color: #888;text-decoration: none; padding: 20px; display: block;} #menu ul li .face{background: url(C:\Users\Anderson\Desktop\wa\img\home.png); float: left; width: 100%; padding:0; margin-bottom: 0; }
  5. Kaio Kdesigner

    Hover não funciona em determinada categoria

    E ai pessoal, não sei se deveria postar na area de wordpress, mas bora la. Eu adicionei mais um itei em um menu php <div class="nav-categories"> <ul> <?php $category_id = get_cat_ID('noticias'); $category_noticias_link = get_category_link($category_id); $category_noticias_child = count(get_posts('category='. $category_id)) > 0; $category_id = get_cat_ID('painelfiscal'); $category_painelfiscal_link = get_category_link($category_id); $category_painelfiscal_child = count(get_posts('category='. $category_id)) > 0; ?> <?php if (is_category('noticias')) { ?> <li><a href="/">Artigos</a></li> <?php if ($category_noticias_child) { ?> <li class="active"><a href="<?php echo esc_url( $category_noticias_link ); ?>">Notícias</a></li> <?php } ?> <?php if ($category_painelfiscal_child) { ?> <li><a href="http://blog.ativore.com/category/painel-fiscal/">Painel Fiscal</a></li> <?php } ?> <?php } elseif(is_category('tutoriais')) { ?> <li><a href="http://blog.ativore.com/category/artigos/">Artigos</a></li> <?php if ($category_noticias_child) { ?> <li><a href="<?php echo esc_url( $category_noticias_link ); ?>">Notícias</a></li> <?php } ?> <?php if ($category_painelfiscal_child) { ?> <li><a href="http://blog.ativore.com/category/painel-fiscal/">Painel Fiscal</a></li> <?php } ?> <?php } elseif(!is_category('imprensa')) { ?> <li class="active"><a href="http://blog.ativore.com/category/artigos/">Artigos</a></li> <?php if ($category_noticias_child) { ?> <li><a href="<?php echo esc_url( $category_noticias_link ); ?>">Notícias</a></li> <?php } ?> <?php if ($category_painelfiscal_child) { ?> <li><a href="http://blog.ativore.com/category/painel-fiscal/">Painel Fiscal</a></li> <?php } ?> <?php } ?> </ul> </div> no caso é o PAINEL FISCAL, até ai blz, tudo funcionando certinho, menos o hover! Quando clico na aba PAINEL FISCAL ele carrega os posts certinhos, porem o hover fica na aba ARTIGOS Eu não sou programador, então to tomando uma surra a semanas e não consigo fazer isso funcionar, alguém poderia me ajudar?
  6. João Vitor Ferreira

    transição No fundo do botão

    Olá pessoal... Estou tendo um problema em criar um botão com fundo animado usando css e html queria fazer um botão parecido com esse aqui é o sweep to right EXEMPLO Quero fazer so com css e html
  7. Galera, sou meio novato na área. Estou fazendo um site para uma pizzaria e preciso que ao passar o mouse encima de uma pizza no cardápio do site (texto) aparece a imagem da pizza relacionada... Alguém sabe um código bem simples pra não me dar dor de cabeça? Sei que é algo com o hover mais tentei vários exemplos e nenhum deu certo. Qualquer ajuda é válida. Obrigado desde já!
  8. william_developer

    COMO AFETAR MAIS DE UM ELEMENTO COM A TAG HOVER

    Pessoal; boa noite! A pergunta já meio intuitiva mais vou compartilhar o código. Eu tentei assim, porém não deu heheheheh. Quando o mouse está sobre o elemento ESCURECER1 dou um OPACITY no elemento MAQUINA1 e mudo a cor da fonte da DIV ESCURECER1. Alguém poderia me ajudar ? Thx. #escurecer1:hover #maquina1{ opacity: 0.5; transition: 1s; #escurecer1 color: #546; }
  9. Julio Cavallari

    Hover em imagem não aparece

    Esotu com um problema no meu código, quando eu posiciono o mouse em cima da imagem o hover dela não aparece, já até coloquei um valor absurdo de z-index, achando que o problema era esse mas não resolveu, e a classe está sendo ativada quando eu olho o console, mas não aparece .content-area .entry-thumb { text-align: center; transition: all 1s ease-in; } .content-area .entry-thumb:hover { background-color:rgba(255,255,255,0.7); z-index:1000000; } <article id="post-106" class="post-106 post type-post status-publish format-image has-post-thumbnail hentry category-newborn post_format-post-format-image"> <div class="entry-thumb"> <a href="http://brunooliveirafotoedesign.esy.es/newborn/newborn-samuel/" title="Newborn Samuel"><img width="830" height="553" src="http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-830x553.jpg" class="attachment-sydney-large-thumb size-sydney-large-thumb wp-post-image" alt="" srcset="http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-830x553.jpg 830w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-300x200.jpg 300w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-768x512.jpg 768w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-230x153.jpg 230w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-350x233.jpg 350w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-480x320.jpg 480w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n.jpg 960w" sizes="(max-width: 830px) 100vw, 830px" /></a> </div> <header class="entry-header"> <h2 class="title-post entry-title"><a href="http://brunooliveirafotoedesign.esy.es/newborn/newborn-samuel/" rel="bookmark">Newborn Samuel</a></h2> </header><!-- .entry-header --> <div class="entry-post"> </div><!-- .entry-post --> <footer class="entry-footer"> <span class="edit-link"><a class="post-edit-link" href="http://brunooliveirafotoedesign.esy.es/wp-admin/post.php?post=106&#038;action=edit">Edit</a></span> </footer><!-- .entry-footer --> </article><!-- #post-## -->
  10. Estou tentando desenvolver um esquema de avaliação de arquivos que estão hospedados no site do meu cliente. Cada arquivo ganha além do link de acesso uma DIV com as cinco opções de avaliação, que aparecem como estrelas em cinza. Eis o código: <div style="margin-top: -2px"> <?php for($s=1;$s<=5;$s++){ ?> <img id="Estrela<?php echo $s; ?>" class="starClick" onclick="javascript:vota(<?php echo $s; ?>)" src="http://meusite.com.br/star2.png" <?php if($s==1){ echo "style='margin-left: 5px'"; } ?> /> <?php } ?> </div> E o código Javascript, quando ao passar por uma estrela ela muda de cor. E ao clicar, ele avisa qual das cinco opções que você votou: <script type="text/javascript"> $('.starClick').hover(function() { $(this).attr('src', 'http://meusite.com.br/star1.png'); }, function() { $(this).attr('src', 'http://meusite.com.br/star2.png'); }); function vota(val){ if(val == '1'){ alert('Você votou HORRÍVEL'); } else if(val == '2'){ alert('Você votou RUIM'); } else if(val == '3'){ alert('Você votou MÉDIO'); } else if(val == '4'){ alert('Você votou BOM'); } else if(val == '5'){ alert('Você votou ÓTIMO'); } } </script> Existe algum modo prático de melhorar a função hover nesse caso? Seria mais ou menos assim: - Passa pela estrela 5 e todas mudam de cor. - Passa pela estrela 4 e só as estrelas 1, 2, 3 e 4 mudam de cor. - Passa pela estrela 3 e só as estrelas 1, 2 e 3 mudam de cor. - Passa pela estrela 2 e só as estrelas 1 e 2 mudam de cor. - Passa pela estrela 1 e só ela muda de cor. Porque no momento, só a respectiva estrela muda de cor quando se passa por ela. Alguém sabe?
  11. marcossantana10

    Elementos (botões) dentro de hover em imagem

    Olá galera, eu gostaria usar esse efeito no meu projeto, quando o usuário passa o mouse, a foto recebe essa camada por cima com as opções de alguns botões dentro (que serão como o exemplo, as redes sociais). O problema é que não sei como faz, nem sequer sei o nome do efeito. O exemplo de como eu quero tá no link abaixo, na sessão "OUR TEAM" na home mesmo, ou clicando no menu superior em "TEAM": http://creativelycoded.com/demos/eDental/
  12. Olá, sou novo tanto no fórum quanto no desenvolvimento de sites e estou com uma dúvida que talvez seja simples de solucionar. Preciso fazer com que o hover do menu permaneça selecionado enquanto o mouse está na ul do submenu. Segue o código: <nav> <ul class="menu"> <li class="active"><a class="active" href="#">EMPRESA</a> <ul class="submenu"> <li><a class="selection" href="#">RESUMO</a></li> <li><a href="#">VENDAS</a></li> <li><a href="#">COMPRAS</a></li> <li><a href="#">ORÇAMENTO</a></li> <li><a href="#">RELATÓRIOS</a></li> </ul> </li> </ul> </nav> css: .menu{ margin: 0; padding: 0; list-style: none; width: 980px; margin: auto; position: relative; z-index: 1; } .menu li { float: left; margin-left: 2px; } .menu li a{ display: inline-block; padding: 6px 20px; color: #FFF; text-decoration: none; font-size: 13px; font-weight: 500; background-color: #23A4CE; -webkit-border-top-left-radius: 2px; -webkit-border-top-right-radius: 2px; -moz-border-radius-topleft: 2px; -moz-border-radius-topright: 2px; border-top-left-radius: 2px; border-top-right-radius: 2px; border: 1px solid #23A4CE; border-bottom: none; } .menu li a:hover, .menu li a.active { background-color: #E2E7EA; color: #222; border: 1px solid #c4c4c4; border-bottom: none; } .menu li:hover ul, .menu li.active ul{ display: block; } .menu li a.cap { background-color: #222; border: 1px solid #222; border-bottom: none; } .menu li a.cap:hover { background-color: #E2E7EA; color: #222; border: 1px solid #c4c4c4; border-bottom: none; } .submenu{ list-style: none; position: absolute; float: left; background-color: #E2E7EA; width: 1022px; ; display: none; padding-left: 30px; } .submenu li{ float: left; margin: 0; } .submenu li a{ background-color: transparent; border: none; color: #7F888A; padding: 9px 15px; font-size: 11px; } .submenu li a:hover{ border: none; } .menu li:hover ul, .menu li.over ul{ display: block; } .submenu li a.selection{ color: #23A4CE; }
  13. joelson souza

    hover

    Ola gente. Estou tentando fazer uma loja e preciso saber, como fazer para que a minha div apareça apenas uma vez no hover. meu problema. é que quando eu passo o mause varias vezes na div ela fica aparecendo varias vezes. preciso fazer igual esse site aqui https://www.useverso.com/ . quando passo o mause na roupa ai aparece uma vez so o valor do produto. seria mais ou menos desse jeito . desde já obrigado.
  14. danifarias2015

    Customizar javascript ocultar/mostrar

    Pessoal, estou tentando criar um a:hover para o código abaixo via css, mas não vai, não ativa, mesmo que eu modifique as divs e faça trocentas coisas, não vai. Já mudei o código, já tentei alterar pra que o java forneça isso, mas não vai. Alguém saberia como fazer? <!--Script revelar esconder Inicio --> <script type='text/javascript'> $(document).ready(function() { $(".mostrar").hide(); $(".ocultar").click(function() { $(this).next(".mostrar").slideToggle(900); }); }); </script> <!--Script revelar esconder Final--> O código do tema: <div class="ocultar"><?php comments_number(__('Comentários'), __('1 comentário'), __('% comentários'),'closedcomt', __('Comentários Fechados')); ?></div> css: .mostrar {float: right; width: 760px;} .ocultar {width:140px; height:20px; text-align:center; color: #2c2b45; cursor:pointer; background: #7bdba0;} .ocultar a:hover {color: #FF6C00;}
  15. leoamrl

    Quero deixar essas imagens em uma lightbox

    Quero que as imagens dessa página: http://www.canatibago.com.br/novo/quem-usa/ ao clicar abra tipo um "pop up" , estilo lightbox, ao invés da maneira que está agora, quando clica abre a imagem sozinha e sai do site. Site rodando em wordpress, tem algum plugin que faça isso automaticamente ?
  16. Vini Martins

    Aparecer ao passar o mouse por cima

    Olá galera, então estava fuçando um site e achei bem bacana algo que ele faz, pode parecer muito simples, mas gostei muito! O site é http://descomplica.com.br/, rolando um para baixo podemos ver que tem uma categoria Disciplinas, e que ao passar o mouse por cima, aparece um certo tipo de conteúdo, com opacidade. Eu estava querendo utilizar o mesmo método, uma vez que passar o mouse por cima, aparecerá algo por cima.
  17. Boa tarde, alguém pode me ajudar por favor.... Gostaria de executar a função resizable() do jquery UI, mas somente quando o usuario passar ou mouse no elemento e quando tirar o mouse desabilitar a função.
×

Informação importante

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