Dúvida no jquery...

PHP

07/03/2014

Galera, alguém sabe qual é essa jquery que se encontra no site a seguir?
quando o mouse é colocado em cima de tipo "Prefeitura", ele abri automático as opções...
http://gloria.ba.gov.br/
Onde posso encontrar?
Andrew Angelim

Andrew Angelim

Curtidas 0

Respostas

Rafael Carrenho

Rafael Carrenho

07/03/2014

Andrew,

Muito provavelmente foi utilizado o jQuery UI, uma outra biblioteca usada junto com o jQuery para realizar efeitos visuais. Inclusive vale a pena dar uma olhada nas demos, o jQuery UI é capaz de muitos efeitos que podem agradar muito na experiência do usuário navegando no seu site.

Mas neste caso em específico o efeito usado foi o accordion, mas com trigger no evento de mouseover, felizmente no próprio site do jQuery já tem a funcionalidade demonstrada, para ver o código fonte basta clicar em "View source code":
[url:descricao=http://jqueryui.com/accordion/#hoverintent]http://jqueryui.com/accordion/#hoverintent[/url]
GOSTEI 0
Andrew Angelim

Andrew Angelim

07/03/2014

Muitíssimo obrigado cara...

Grande ajuda..;)
GOSTEI 0
Andrew Angelim

Andrew Angelim

07/03/2014

Gostei muito dos Demos..

Vai ser de grande utilidade...


mais uma vez obrigado ;)
GOSTEI 0
Marisiana Battistella

Marisiana Battistella

07/03/2014

Muito bom!
Também gostei das demos, vai ser bem útil!
Obrigada!
GOSTEI 0
Raphael Souza

Raphael Souza

07/03/2014

Olá, bom dia! Teste aqui e com o mouseover não aconteceu nada, mas no click existe um efeito do tipo toggle na altura. Se for esse tipo de efeito que deseja, não há a necessidade de utilizar jQuery UI, pois seria apenas mais um arquivo a ser carregado no site/sistema. O mesmo resultado pode ser obtido somente com o jquery da forma muito simples:

** SOLUÇÃO VÁLIDA SOMENTE SE O EFEITO DESEJADO FOR O MESMO QUANDO O USER CLICA NO LINK PREFEITURA DO SITE DE EXEMPLO **

HTML

<section id='teste'>
<header>Prefeitura</header>

<div class='opcoes'>

<ul>
<li>A prefeitura</li>
<li>Vice-prefeito</li>
</ul>

</div>

</section>


jQuery


$(document).ready(function(){

var opcoes = $('.opcoes');
var trigger = $('#teste');

opcoes.hide();

// EVENTO NO CLICK

trigger.click(function(){
    $(opcoes).animate({
        height: 'toggle'
     });
});
});


O código está bem superficial, mas acredito que dê pra ilustrar o efeito desejado.
Qualquer coisa é só postar.

Abraço.
GOSTEI 0
POSTAR