Jump to content

Search the Community

Showing results for tags 'carousel'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Web Development
    • HTML e CSS
    • Javascript
    • PHP
    • Ruby
    • Python
    • Java
    • .NET
    • Docker, Kubernets and other environments
    • WordPress
    • Mobile
    • Agile
    • Desenvolvimento de Games
    • Banco de Dados
    • Design and UX
    • Algoritmos & Outras Tecnologias
  • Entretenimento e uso pessoal
    • Segurança & Malwares
    • Geral
    • iMasters's pub

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 5 results

  1. welington.miranda

    script JS dinamicamente

    pessoal, é o seguinte preciso desse SCRIPT funcione para todos os carousels que tenho que as devidas configurações e conteudos vem do banco de dados. a função desse script e esconder as setas do carousel e exibir, quando for inicio e quando for final. O problema que quando clico em qualquer seta ele movimenta todos ao mesmo tempo. Queria ajuda de voces para ajustar isso?!? $('.carousel').carousel({ interval: false, }) $('.carousel').ready(function () { checkitem(); }); $('.carousel').on('slid.bs.carousel', checkitem); function checkitem() { var $this = $('.carousel'); if($('.carousel-inner .carousel-item:eq(0)') .hasClass('active')) { // Hide left arrow $('.carousel-control-prev', document).hide(); // But show right arrow $('.carousel-control-next', document).show(); } else if ($('.carousel-inner .carousel-item:last').last().hasClass('carousel-item')) { // Hide right arrow $('.carousel-control-prev' , document).show(); // But show left arrow $('.carousel-control-next' , document).hide(); } else { $('.carousel-control-prev, .carousel-control-next', $this).show(); } }
  2. Olá! Tenho um carousel em Bootstrap que se ajusta automaticamente à página, porém no modo mobile fica muito pequeno. O carousel está direto no <body>. Segue o código. O resultado pode ser visualizado em: http://equipenovainfo.com.br/_portifolio/br_informatica_tec/ <!-- CAROUSEL --> <div id="carousel_slide" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li class="active bg-primary" data-target="#carousel_slide" data-slide-to="0"></li> <li class="bg-primary" data-target="#carousel_slide" data-slide-to="1"></li> <li class="bg-primary" data-slide-to="#carousel_slide" data-target-to="2"></li> </ol> <div class="carousel-inner"> <div class="carousel-item active"> <img class="img-fluid" src="_imagens/_slide/foto01.jpg" alt=""> <div class="carousel-caption text-dark d-none d-md-block"> <h2>Título da Descrição I</h2> <p class="lead">A descrição deste anúncio do banner aparece aqui!</p> </div> </div> <div class="carousel-item"> <img class="img-fluid" src="_imagens/_slide/foto02.jpg" alt=""> <div class="carousel-caption text-dark d-none d-md-block"> <h2>Título da Descrição II</h2> <p class="lead">A descrição deste anúncio do banner aparece aqui!</p> </div> </div> <div class="carousel-item"> <img class="img-fluid" src="_imagens/_slide/foto03.jpg" alt=""> <div class="carousel-caption text-dark d-none d-md-block"> <h2>Título da Descrição III</h2> <p class="lead">A descrição deste anúncio do banner aparece aqui!</p> </div> </div> </div> <a class="carousel-control-prev" href="#carousel_slide" role="button" data-slide="prev"> <span class="carousel-control-prev-icon"></span> <span class="sr-only">Anterior</span> </a> <a class="carousel-control-next" role="button" data-slide="next" href="#carousel_slide"> <span class="carousel-control-next-icon"></span> <span class="sr-only">Avançar</span> </a> </div>
  3. Estou com o seguinte problema: Criei um código PHP que monta perfeitamente o carousel com o nome das imagens em meu banco de dados, porém o carousel fica congelado na primeira imagem, sei que é apenas um detalhe mas não estou conseguindo rodar. <?php // Parte que chama o slider como o id das fotosextras $idp = $imovel; $sqls = mysql_query("SELECT * FROM imovelfotoextra WHERE idimovel='".$idp."' order by id desc LIMIT 16"); $numRegistros = mysql_num_rows($sqls); $contador = $numRegistros; ?> <div id="myCarousel" class="carousel slide" data-ride="carousel"> <?php If ($numRegistros != 0){ // <!-- Indicators --> echo "<ol class=\"carousel-indicators\">"; $reg = 0; while ($dadoss=mysql_fetch_array($sqls)){ if ($contador == 1 || $reg == 0){ echo "<li data-target=\"#myCarousel\" data-slide-to=\"".$reg."\" class=\"active\"></li>"; $contador = $contador + 1; $reg = $reg + 1; } else { echo "<li data-target=\"#myCarousel\" data-slide-to=\"".$reg."\"></li>"; $contador = $contador + 1; $reg = $reg + 1; } } echo "</ol> <div class=\"carousel-inner\">"; $sqltris = mysql_query("SELECT * FROM imovelfotoextra WHERE idimovel='".$idp."' order by id asc LIMIT 16"); $flagtris = 0; while($dadostris=mysql_fetch_array($sqltris)){ if ($flagtris == 0){ echo "<div class=\"item active\"> <img src=\"paginas/midias/images/".$dadostris[foto]."\" Alt=\"".$dadostris[foto]."\" border=\"0\" /></div>"; } else { echo "<div class=\"item\"> <img src=\"paginas/midias/images/".$dadostris[foto]."\" Alt=\"".$dadostris[foto]."\" border=\"0\" /></div>"; } $flagtris = 1; } echo "</div>"; } else { echo "<ol class=\"carousel-indicators\">"; echo "<li data-target=\"#myCarousel\" data-slide-to=\"0\" class=\"active\"></li>"; echo "</ol> <div class=\"carousel-inner\">"; echo "<div class=\"item active\"><img src=\"paginas/thumbs.php?w=200&h=125&imagem=midias/images/".$mostra[foto]."\" border=\"0\"></div>"; echo "</div>"; } ?> <!-- Left and right controls --> <a class=\"left carousel-control\" href=\"#myCarousel\" role=\"button\" data-slide=\"prev\"> <span class=\"glyphicon glyphicon-chevron-left\" aria-hidden=\"true\"></span> <span class=\"sr-only\">Anterior</span> </a> <a class=\"right carousel-control\" href=\"#myCarousel\" role=\"button\" data-slide=\"next\"> <span class=\"glyphicon glyphicon-chevron-right\" aria-hidden=\"true\"></span> <span class=\"sr-only\">Próximo</span> </a> </div>Um exemplo do que ocorre pode ser localizado em http://www.forsterimoveis.com.br/index.php?p=imovel&id=1071 ao clicar no carousel ele não vai para a próxima imagem do imóvel. Agradeço desde já. Cordialmente. Leandro Mesquita
  4. Thais Hoe

    Carrosel com texto

    Bom dia estou desenvolvendo um site, mas tenho pouquíssima (quase nenhuma) noção de JS. Preciso fazer um carrosel que mostre o nome de um cliente e a avaliação que ele deixou. Com base nesse código consegui fazer algo que funcione: O problema é que quando eu coloco o script js para aparecer a primeira avaliação (#wall-1), ao abrir a página ele direciona o navegador direto para a parte das avaliações, que no caso é no final da pagina, acima do rodapé. Sem o script, ele não aparece as avaliações... Tentei procurar um pouco sobre a propriedade window mas não consegui uma solução. Se alguém tiver uma solução ou um outro código (de preferencia simples como esse), me ajudaria muito. Obs: já coloquei o código no header, footer e em um arquivo separado .js EDIT: Se alguém puder me dizer como setar um timer também para mudar sozinho de avaliação agradeço. Obg
  5. Estou criando uma galeria, na pagina inicial fica as thumbs, ao clicar em uma abre uma modal com todas as imagens daquela galeria. (Obs. ao salvar no db as imagens da galeria ex. "01" todas as imagens são salvas na mesma coluna e são separadas por "," 7172381372.jpg,3216382763.jpg...) Ao realizar o loop a galeria com as thumbs funciona perfeitamente. Ao clicar em uma thumb, abre o modal e nele todas as fotos atribuida aquele thumb "galeria" as imagens são mostradas pelo carousel bootstrap. No entanto apenas a ultima galeria add no db funciona o carousel (ex: add galeria 01, funciona tudo normalmente a galeria com carousel, add a galeria 02, essa funciona normalmente o carousel, no entanto o carousel da 01 para de funcionar. <div class="row"> <?php while($rows = mysqli_fetch_assoc($resultado)){ $foto = rows['foto'];?> <div class="gallery_product col-md-3 col-sm-4 col-xs-12"> <a href="#" data-toggle="modal" data-target="#myModal<?php echo $rows['id_produto']; ?>" ><img src="uploads/thumb_<?php echo $foto; ?>" class="img-responsive"></a> </div> <div class="modal fade" id="myModal<?php echo $rows['id_produto']; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog" id="<?php echo $rows['id_produto']; ?>" > <div class="modal-content" > <div class="modal-body text-center pagination-centered"> <!----------------CAROUSEL------------------------> <?php $imagens_nome = $foto; $imagens=explode(',',$imagens_nome); ?> <!-- Indicators --> <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <!-- Indicators --> <ol class="carousel-indicators"> <?php $cont=0; foreach($imagens as $img){?> <li data-target="#carousel-example-generic" data-slide-to="<?php echo $cont;?>" class="<?php echo ($cont==0)?" active ":" ";?>"></li> <?php $cont++;} ?> </ol> <!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <?php $cont=0; foreach($imagens as $img){?> <div class="item <?php echo ($cont==0)?" active ":" ";?>"> <img src="uploads/<?php echo $img; ?>" width="100%"alt="..."> <div class="carousel-caption"> </div> </div> <?php $cont++; } ?> </div> <!-- Controls --> <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </div> <div class="modal-header"> </div> <?php } ?> </div>
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.