EasysLider 1.7 Ajuda - Todo o conteúdo exibido na página Carregar
-
26-09-2019 - |
Pergunta
Ao implementar o Slider Easy Slider 1.7 com jQuery em uma página minha, acho que quando a página é carregada primeiro, ambas as imagens no ul
exibição deslizante e, em seguida, o deslizador carrega corretamente e apenas o primeiro slide é exibido.
Qual é a melhor maneira de corrigir isso para que o controle deslizante div
não é exibido até que o script esteja carregado corretamente? Estou usando este código para executá -lo:
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true,
pause: 10000
});
});
Solução
Você pode apenas ocultar o conteúdo via CSS, assim:
#slider { display: none; }
Em seguida, mostre -o no carregamento da página também:
$(document).ready(function(){
$("#slider").show().easySlider({ auto: true, continuous: true, pause: 10000 });
});
Para estar seguro, eu adicionaria um bloco à página para usuários que não são do JS, poderia ser uma folha de estilo dentro se você tiver muitas delas, caso contrário, apenas uma tag de estilo:
<noscript><style type="text/css">#slider { display: block; }</style></noscript>
Outras dicas
Adicionei o código abaixo ao meu CSS para ocultar as imagens de serem empilhadas.
/*Added to hide stacking of images on IE 7/8*/
#slider{
height:227px;
overflow:hidden;
}