j-Intro

jComponent 20 · jcomponent@20 component Exemplo carregado com jComponent 20

Configuração:

if {String} condição para a apresentação do intro, é comparado com o valor dentro de path
next {String} opcional, texto para o botão seguinte (default: Next)
close {String} opcional, texto para o botão de passo próximo (default: Done)
page {String} opcional, um link para o método function(page) {} é executado quando a página é alterada
exec {String} opcional, um link para o método function() {} é executado quando a entrada é fechada
check {String} opcional, um link para o método function(done) {} é executado quando clicado no botão último
remove {Boolean} opcional, quando true então o componente será removido após fechar (default: false)
closebutton {Boolean} mostra o botão próximo no canto superior direito (default: false)
width {Number} a largura máxima (default: 400)
height {Number} Alterações (default 300)
NEW: delay {Number} um atraso para o botão next entre os cliques
NEW: nexticon {String} um ícone feito (default: ti ti-chevron-right)
NEW: doneicon {String} um ícone feito (default: ti ti-check-circle)

Bom para saber:

Cada botão com name="next" será usado como o botão next
Cada botão com name="close" será usado como o botão close
Um link com a classe next fornecido será usado como um botão next
Um link com a classe close fornecido será usado como um botão close

Use-o com <ui-component name="intro">Quando o componente ainda não está carregado, jComponent Descarrega-o no primeiro uso do endereço DEF.fallback (a partir do Componentator CDN por padrão). autor: Peter Širka. fonte: o Componentator Reserva de componentes, licença MIT.

example.html

<ui-component name="intro" path="showme" config="if:myintro" class="hidden">
	<figure>A</figure>
	<figure>B</figure>
	<figure>C</figure>
	<figure>D</figure>
	<figure>E</figure>
</ui-component>

<script>
	SET('showme', 'myintro', 2000);
</script>