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
  • Desenvolvimento e Banco de Dados
    • HTML e CSS
    • Java
    • Javascript
    • .NET
    • PHP
    • Python
    • Ruby
    • Mobile
    • Ambientes de Desenvolvimento
    • Arquitetura e Métodos Ágeis
    • Banco de Dados
    • DevOps
    • Desenvolvimento de Games
    • E-Commerce e Pagamentos Online
    • SEO e Otimizações
    • WordPress
    • Algoritmos & Outras Tecnologias
  • Design e Produto
    • Fotografia
    • Photoshop
    • Design de interfaces e UX
    • Edição/Produção de Vídeos
    • Marketing Online
    • Desenho, Ilustração e 3D
  • Entretenimento e uso pessoal
    • Geral
    • Segurança & Malwares
    • Gadgets e wearable
    • Softwares e Apps
    • Entretenimento

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 9 results

  1. 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>
  2. 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
  3. 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
  4. 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>
  5. guilomaker

    Ajuda com Carousel

    Boa tarde! bom, estou precisando fazer um carousel, eu estou usando o jCarouselLite, ate então foi o mais simples que eu achei e que me atendeu! só que no decorrer das coisas me deparei com um problema, entrem nesta pagina. http://catalogo.reidoaluminio.com.br/ veja que quando clica na seta, ele e aplicado pra todos blocos, eu precisaria que ele funcionasse só no bloco atual. outra coisa a div que uso para a carousel e a .nav-produtos $(".nav-produtos").jCarouselLite({ btnNext: ".arrow-right", btnPrev: ".arrow-left", }); }); ela se repete pra todos os blocos, como toda as utras divs, o que acontece e que ali ela esta em dois blocos só, São jorge e Real. Se eu adicionar mais blocos com a div .nav-produtos, o bloco inteiro some, ta como se eu só pudesse usar em dois. qual a melhor maneira de implementar esse carousel ?
  6. guilomaker

    Ajuda com Carousel

    Boa tarde! bom, estou precisando fazer um carousel, eu estou usando o jCarouselLite, ate então foi o mais simples que eu achei e que me atendeu! só que no decorrer das coisas me deparei com um problema, entrem nesta pagina. http://catalogo.reidoaluminio.com.br/ veja que quando clica na seta, ele e aplicado pra todos blocos, eu precisaria que ele funcionasse só no bloco atual. outra coisa a div que uso para a carousel e a .nav-produtos $(".nav-produtos").jCarouselLite({ btnNext: ".arrow-right", btnPrev: ".arrow-left", }); }); ela se repete pra todos os blocos, como toda as utras divs, o que acontece e que ali ela esta em dois blocos só, São jorge e Real. Se eu adicionar mais blocos com a div .nav-produtos, o bloco inteiro some, ta como se eu só pudesse usar em dois, por exemplo o havai. qual a melhor maneira de implementar esse carousel ?
  7. Olá pessoal, Estou com um problema.. Coloquei um efeito no caption do carousel do bootstrap, porém ele está sem transition out. Eu uso esse mesmo efeito em outras partes do layout, porém em buttons e ele está funcionando normalmente. Acredito que seja por causa do visible hidden e opacity que coloquei... porém ele precisa ser dessa forma, tem que aparecer apenas quando passa o mouse na imagem. Segue o código como está agora no jsfiddle. http://jsfiddle.net/fabricior/cvx1fjzm/ Ajudemm!! =) Valeu!
  8. Galera, o seguinte: Estou tetando fazer com que a galeria do wordpress, vire esse carousel http://leslolos.com/it-aint-easy-being-vert/ (Clique em alguma foto para vê). Não estou achando nenhum plugin, e ja tentei fazer de várias formas e não consegui.. Alguém pode me ajudaR? Abraços
  9. Don_Brazucon

    slider com 4 linhas de código

    sapor ra aqui nao funciona alguem me ajuda? <section> <div id="caroussel"> <h2>Latest Works</h2> <nav> <a href="" class="active"></a> <a href=""></a> <a href=""></a> </nav> <div class="inner"> <ul> <li> <a href=""> <img src="img/foto_1.jpg" alt=""/> </a> </li> <li> <a href=""> <img src="img/foto_2.jpg" alt=""/> </a> </li> <li> <a href=""> <img src="img/foto_3.jpg" alt=""/> </a> </li> </ul> </div> </div> </section> #caroussel h2{ float:left; padding-top:5px; margin-bottom:18px; } #caroussel nav{ padding-top:20px; float:right; margin-bottom:8px; } #caroussel nav a{ float:left; width:9px; height:9px; margin-left:15px; border:1px solid #9a9b9c; border-radius:20px; background-color:#fff; transition:background-color .2s ease-out; -webkit-transition:background-color .2s ease-out; -moz-transition:background-color .2s ease-out; } #caroussel nav a:hover{ background-color:#ccc; } #caroussel nav a.active{ background-color:#aaa; } #caroussel .inner { clear:left; width:1200px; height:412px; overflow:hidden; } #caroussel ul{ width:3600px; height:412px; list-style-type:none; } #caroussel ul li{ position:relative; float:left; } $("#caroussel nav a").click(function(){ var ind = $(this).index("#caroussel nav a"); $("#caroussel ul li").animate({"margin-left": "-"+ind*1200}); $("#caroussel nav a").removeClass("active"); $(this).addClass("active"); return false; });
×

Important Information

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