jQuery UI

Efeito de Highlight com jQuery UI

Como fazer uma animação / efeito de Highlight com jQuery UI (framework).

É possível criar vários tipos de efeitos utilizando jQuery UI,

<p id="p-test">Texto de teste</p>

$("#p-test").effect("highlight", {}, 3000);

O primeiro parâmetro que passamos na função “effect” é o efeito que desejamos, no caso “highlight”.

Segundo, podemos definir uma função de callback, a ser executada após a conclusão do efeito e o terceiro é o tempo em mile segundos do efeito, no caso, temos 3 segundos (3000).

Complementando o Highlight

Você também pode utilizar junto a função “toggle”.

Toggle é uma função muito útil que junta fadeIn e fadeOut em uma unica função.

$( "#p-test" ).toggle( "highlight" );

Highlight é muito útil em mostrar feedbacks visuais das ações que ocorrem no seu site / sistema.

Exemplo do Efeito de Highlight com jQuery UI

São os pequenos detalhes que fazem toda a diferença na usabilidade de um sistema.

Resumo
Nome do Artigo
Efeito de Highlight com jQuery UI
Descrição
Como criar um Efeito de Highlight com jQuery UI
Autor
Editor
Roger Mauricio Takemiya
Logo do Editor

Post Recentes

YouTube sem cookie: adiar o embed do vídeo e do Maps até o aceite

Seu banner de consentimento está certo, mas o vídeo incorporado grava cookie de terceiro no primeiro carregamento. Troque o domínio…

7 horas atrás

Custom post type dando 404: flush_rewrite_rules na ativação do plugin

A listagem do custom post type abre e o single dá 404 no WordPress 6.9. Entenda o cache das rewrite…

2 dias atrás

systemd timer no lugar do cron: agendar script com log e sem execução dupla

Um par .service e .timer substitui a linha do crontab com log no journal, execução perdida recuperada no boot e…

2 dias atrás

Descrição em massa no WooCommerce: wp eval-file lendo a lista de SKUs

400 produtos importados do fornecedor com a aba Descrição vazia. Um wp eval-file percorre os SKUs sem texto, grava pelo…

2 dias atrás

Frete grátis no WooCommerce: esconder as outras opções de entrega

Some com PAC e SEDEX da lista quando o frete grátis está disponível, usando woocommerce_package_rates, e limpe o cache de…

3 dias atrás

Erro HTTP no WordPress ao enviar imagem para a biblioteca de mídia

A barra de upload chega no fim e o WordPress devolve só "Erro HTTP". Separe as três causas: Imagick barrado…

3 dias atrás