Bom dia pessoal,
Estou com uma dúvida em relação ao código a seguir e acredito que alguém possa me ajudar, esse código se refere aos banners do site da empresa que eu trabalho, no caso essa aqui: http://tcacontabilpr.com.br/index.php
Percebam que ficam passando 4 banners no site, com diferentes noticias, só que não tem uma barra de navegação, aquelas flechas para voltar ou passar o banner. Gostaria de saber se tem como eu implementar isso e o que eu tenho que modificar no código.
Segue código:
<div class="banner hidden">
<div class="fd-slogan">
<div class="estrutura" id="textosBanner">
<p onclick="window.open('fluxodecaixa.php','_parent')" style="cursor: pointer;"><span>10 DICAS</span> PARA <span>MELHORAR</span> O <span>FLUXO DE CAIXA</span> DA SUA <span>EMPRESA</span></p>
<p onclick="window.open('lider.php','_parent')" style="cursor: pointer;">COMO UM <span>LÍDER</span> ATUA NO <span>GERENCIAMENTO DE PESSOAS</span>?</p>
<p onclick="window.open('ferias.php','_parent')" style="cursor: pointer;"><span>O QUE</span> SÃO <span>PERÍODO AQUISITIVO</span> E <span>PERÍODO CONCESSIVO</span> DE <span>FÉRIAS?</span></p>
<p onclick="window.open('nome.php','_parent')" style="cursor: pointer;"><span>QUAL</span> A <span>IMPORTÂNCIA</span> DO <span>NOME</span> DA SUA <span>EMPRESA</span>?</p>
</div>
</div>
<img src="banner/01.jpg">
<img src="banner/02.jpg">
<img src="banner/03.jpg">
<img src="banner/04.jpg">
</div>
<img src="imagem/shadow.png" class="sombra">
<script>
$(function(){
$('.banner').cycle({});
});
$(function(){
$('#textosBanner').cycle({
slides: '> p'
});
});
</script>
Obs: Não tenho muita experiencia com desenvolvimento web, estou usando filezilla e o notepad++ para fazer as modificações no site.
Obs²: Me indicaram bootstrap, mas não sei como fazer a implementação no site, se puderem me auxiliar ficarei muito agradecido
Obrigado desde já.