<?xml version="1.0" encoding="UTF-8"?> <rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" ><channel><title>AlyenStudio &#187; imagens</title> <atom:link href="http://www.alyenstudio.com/tag/imagens/feed" rel="self" type="application/rss+xml" /><link>http://www.alyenstudio.com</link> <description>Portifólios, temas de SMF, temas para wordpress, notícias, downloads e as ultimas novidades...</description> <lastBuildDate>Wed, 30 Nov 2011 11:16:47 +0000</lastBuildDate> <language>en</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3.1</generator> <item><title>As melhores Image Galleries &amp; Sliders em jQuery</title><link>http://www.alyenstudio.com/codigos/jquery/as-melhores-image-galleries-sliders-em-jquery-457.html</link> <comments>http://www.alyenstudio.com/codigos/jquery/as-melhores-image-galleries-sliders-em-jquery-457.html#comments</comments> <pubDate>Wed, 19 May 2010 12:11:40 +0000</pubDate> <dc:creator>Alyen</dc:creator> <category><![CDATA[jQuery]]></category> <category><![CDATA[background image]]></category> <category><![CDATA[banner rotator]]></category> <category><![CDATA[easy slider]]></category> <category><![CDATA[galleries sliders]]></category> <category><![CDATA[image free]]></category> <category><![CDATA[image galleries]]></category> <category><![CDATA[image google]]></category> <category><![CDATA[image slider]]></category> <category><![CDATA[imagens]]></category> <category><![CDATA[images]]></category> <category><![CDATA[lightbox]]></category> <category><![CDATA[no image]]></category> <category><![CDATA[prototype]]></category> <category><![CDATA[shack image]]></category> <category><![CDATA[sliders jquery]]></category> <category><![CDATA[slides]]></category><guid isPermaLink="false">http://www.alyenstudio.com/?p=457</guid> <description><![CDATA[As galerias de imagens deslizantes com jQuery são comuns em sites de portfolio e também são úteis para qualquer outro tipo de site para exibição de imagens e fotografias. Além disso, proporcionam uma boa experiência para usuário e fazer a visualização de imagens mais agradável e intuitiva, em seu site. Com o advento de poderosos [...]]]></description> <content:encoded><![CDATA[<p>As galerias de imagens deslizantes com <strong>jQuery</strong> são comuns em sites de portfolio e também são úteis para qualquer outro tipo de site para exibição de imagens e fotografias. Além disso, proporcionam uma boa experiência para usuário e fazer a visualização de imagens mais agradável e intuitiva, em seu site. Com o advento de poderosos frameworks JavaScript como <strong>jQuery</strong>, <strong>Prototype</strong>, <strong>Mootools</strong> etc, a qualidade da imagem galerias e slideshows JavaScript base melhoraram dramaticamente.</p><p><img class="aligncenter size-full wp-image-458" title="jquery-slideshows" src="http://www.alyenstudio.com/wp-content/2010/05/jquery-slideshows.jpg" alt="jquery slideshows As melhores Image Galleries & Sliders em jQuery" width="500" height="281" />O site <a href="http://www.hongkiat.com/blog/jquery-image-galleries-sliders-best-of/">hongkiat.com</a> preparou para você uma boa lista dos<strong> melhores plugins em jQuery para fazer a sua galeria de imagem</strong> onde podemos encontrar os recursos que você precisa para criar uma galeria ou um slider no seu site.</p><h4><a href="http://www.buildinternet.com/project/supersized/">Supersized</a></h4><p><a href="http://www.buildinternet.com/project/supersized/default.php">Programa demonstrativo</a> | <a href="http://www.buildinternet.com/project/supersized/supersized2.zip">Baixar</a><br /> Gigante é um plugin jQuery slidehow fullscreen. Ele suporta imagens com o ciclismo preloading de imagem com efeito de transição.</p><p><img class="aligncenter size-thumbnail wp-image-459" title="supersized" src="http://www.alyenstudio.com/wp-content/2010/05/supersized-590x351.jpg" alt="supersized 590x351 As melhores Image Galleries & Sliders em jQuery" width="590" height="351" /></p><h4><a href="http://devkick.com/lab/galleria/">Galleria</a></h4><p><a href="http://devkick.com/lab/galleria/demo_01.htm">Programa demonstrativo</a> | <a href="http://devkick.com/lab/galleria/jquery.galleria.js">Baixar</a><br /> Galleria é uma galeria de imagens escrito em javascript jQuery. Ele carrega as imagens uma a uma, de uma lista não-ordenada e exibe miniaturas quando cada imagem é carregada.</p><p><img class="aligncenter size-full wp-image-460" title="galleria" src="http://www.alyenstudio.com/wp-content/2010/05/galleria.jpg" alt="galleria As melhores Image Galleries & Sliders em jQuery" width="600" height="392" /></p><h4><a href="http://www.progressivered.com/cu3er/">CU3ER Image Slider</a></h4><p><a href="http://www.progressivered.com/cu3er/">Programa demonstrativo</a> | <a href="http://www.progressivered.com/cu3er/download/cu3er-v0.9.2.zip">Baixar</a><br /> um controle deslizante de imagem, inicialmente concebido para criar transições entre slides 3D, acabou por ser uma solução conveniente e multifuncionais que podem ser aplicados em diversas áreas de construção de sites, desde slider conteúdo a característica deslizante e imagem e banner rotator.</p><p><img class="aligncenter size-full wp-image-461" title="cu3er" src="http://www.alyenstudio.com/wp-content/2010/05/cu3er.jpg" alt="cu3er As melhores Image Galleries & Sliders em jQuery" width="600" height="282" /></p><h4><a href="http://leandrovieira.com/projects/jquery/lightbox/">jQuery lightbox</a></h4><p><a href="http://leandrovieira.com/projects/jquery/lightbox/">Programa demonstrativo</a> | <a href="http://leandrovieira.com/download/7/">Baixar</a><br /> plugin jQuery lightbox é simples, elegante, discreto, sem necessidade de marcação extra e é usado para sobrepor imagens na página atual com o poder ea flexibilidade do seletor do jQuery.</p><p><img class="aligncenter size-full wp-image-462" title="lightbox" src="http://www.alyenstudio.com/wp-content/2010/05/lightbox.jpg" alt="lightbox As melhores Image Galleries & Sliders em jQuery" width="600" height="314" /></p><h4><a href="http://www.twospy.com/galleriffic/#1">Gallerific</a></h4><p><a href="http://www.twospy.com/galleriffic/example-2.html">Programa demonstrativo</a> | <a href="http://www.twospy.com/galleriffic/galleriffic-2.0.zip">Baixar</a><br /> Galleriffic é um plugin jQuery que fornece uma rica experiência pós-back livre otimizado para lidar com grandes volumes de fotografias.</p><p><img class="aligncenter size-thumbnail wp-image-463" title="galleriffic" src="http://www.alyenstudio.com/wp-content/2010/05/galleriffic-590x328.jpg" alt="galleriffic 590x328 As melhores Image Galleries & Sliders em jQuery" width="590" height="328" /></p><h4><a href="http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding">Easy Slider</a></h4><p><a href="http://cssglobe.com/lab/easyslider1.5/01.html">Programa demonstrativo</a> | <a href="http://cssglobe.com/lab/easyslider1.5/easySlider1.5.zip">Baixar</a><br /> Easy Slider é um plugin jQuery, você pode configurar suas próprias opções e é fácil de implementar.</p><p><img class="aligncenter size-thumbnail wp-image-464" title="easyslider" src="http://www.alyenstudio.com/wp-content/2010/05/easyslider-590x180.jpg" alt="easyslider 590x180 As melhores Image Galleries & Sliders em jQuery" width="590" height="180" /></p><h4><a href="http://www.serie3.info/s3slider/">Slider S3: jQuery Image Gallery</a></h4><p><a href="http://www.serie3.info/s3slider/demonstration.html">Programa demonstrativo</a> | <a href="http://www.serie3.info/s3slider/style/code/s3SliderFull.rar">Baixar</a><br /> Slider S3 é um plugin jQuery com efeitos agradáveis e com auto-imagem mudando.</p><p><img class="aligncenter size-thumbnail wp-image-465" title="s3Slider" src="http://www.alyenstudio.com/wp-content/2010/05/s3Slider-590x294.jpg" alt="s3Slider 590x294 As melhores Image Galleries & Sliders em jQuery" width="590" height="294" /></p><h4><a href="http://css-tricks.com/anythingslider-jquery-plugin/">Tudo o Slider</a></h4><p><a href="http://css-tricks.com/examples/AnythingSlider/">Programa demonstrativo</a> | Baixar<br /> AnythingSlider é um plugin jQuery com um monte de recursos (slides pode ser qualquer coisa, abas de navegação são construídos e adicionados dinamicamente &#8230;).</p><p><img class="aligncenter size-thumbnail wp-image-466" title="anythingslider" src="http://www.alyenstudio.com/wp-content/2010/05/anythingslider-590x265.jpg" alt="anythingslider 590x265 As melhores Image Galleries & Sliders em jQuery" width="590" height="265" /></p><h4><a href="http://workshop.rs/projects/coin-slider/">Coin Slider</a></h4><p><a href="http://workshop.rs/projects/coin-slider/">Programa demonstrativo</a> | <a href="http://coin-slider.googlecode.com/files/coin-slider.zip">Baixar</a><br /> Coin Slider é um slider imagem jQuery com efeitos únicos.</p><p><img class="aligncenter size-thumbnail wp-image-467" title="coinsider" src="http://www.alyenstudio.com/wp-content/2010/05/coinsider-590x277.jpg" alt="coinsider 590x277 As melhores Image Galleries & Sliders em jQuery" width="590" height="277" /></p><h4><a href="http://www.malsup.com/jquery/cycle/">Ciclo</a></h4><p><a href="http://www.malsup.com/jquery/cycle/">Programa demonstrativo</a> | <a href="http://www.malsup.com/jquery/cycle/release/jquery.cycle.zip?v2.86">Baixar</a><br /> O jQuery Cycle Plugin é um plugin de slideshow que suporta muitos tipos diferentes de efeitos de transição.</p><p><img class="aligncenter size-thumbnail wp-image-468" title="cycle" src="http://www.alyenstudio.com/wp-content/2010/05/cycle-590x294.jpg" alt="cycle 590x294 As melhores Image Galleries & Sliders em jQuery" width="590" height="294" /></p><h4><a href="http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/">Slider Conteúdo em Destaque</a></h4><p><a href="http://css-tricks.com/examples/FeaturedContentSlider/">Programa demonstrativo</a> | <a href="http://css-tricks.com/examples/FeaturedContentSlider.zip">Baixar</a></p><p><img class="aligncenter size-thumbnail wp-image-469" title="Featured Content Slider" src="http://www.alyenstudio.com/wp-content/2010/05/Featured-Content-Slider-590x301.jpg" alt="Featured Content Slider 590x301 As melhores Image Galleries & Sliders em jQuery" width="590" height="301" /></p><h4><a href="http://www.davidmassiani.com/horinaja/">Horinaja Plugin</a></h4><p><a href="http://www.davidmassiani.com/horinaja/">Programa demonstrativo</a> | <a href="http://www.davidmassiani.com/horinaja/forceDownload.php?framework=jquery">Baixar</a><br /> Horinaja está pronto para usar aplicação de slides, você também pode usar a roda do mouse para navegar entre os slides.</p><p><img class="aligncenter size-thumbnail wp-image-470" title="horinaja" src="http://www.alyenstudio.com/wp-content/2010/05/horinaja-590x211.jpg" alt="horinaja 590x211 As melhores Image Galleries & Sliders em jQuery" width="590" height="211" /></p><h4><a href="http://workshop.rs/projects/jqfancytransitions/">Transitions jqFancy</a></h4><p><a href="http://workshop.rs/projects/jqfancytransitions/">Programa demonstrativo</a> | <a href="http://jqfancytransitions.googlecode.com/files/jqFancyTransitions.1.7.js">Baixar</a><br /> jqFancyTransitions plugin jQuery é fácil de usar para visualizar suas fotos como slideshow com efeitos de transição fantasia.</p><p><img class="aligncenter size-thumbnail wp-image-471" title="jqFancyTransitions" src="http://www.alyenstudio.com/wp-content/2010/05/jqFancyTransitions-590x253.jpg" alt="jqFancyTransitions 590x253 As melhores Image Galleries & Sliders em jQuery" width="590" height="253" /></p><h4><a href="http://jqueryglobe.com/article/feature-list">jQueryGlobe &#8211; Plugin jQuery</a></h4><p><a href="http://jqueryglobe.com/labs/feature_list/">Programa demonstrativo</a> | <a href="http://jqueryglobe.com/labs/feature_list/jquery.featureList-1.0.0.zip">Baixar</a></p><p><img class="aligncenter size-thumbnail wp-image-472" title="jQueryGlobePlugin" src="http://www.alyenstudio.com/wp-content/2010/05/jQueryGlobePlugin-590x291.jpg" alt="jQueryGlobePlugin 590x291 As melhores Image Galleries & Sliders em jQuery" width="590" height="291" /></p><h4><a href="http://nathansearles.com/loopedslider/">Looped Slider</a></h4><p><a href="http://nathansearles.com/loopedslider/example-4.html">Demo</a> | <a href="http://github.com/nathansearles/loopedSlider/zipball/master">Download</a></p><p><img class="aligncenter size-thumbnail wp-image-473" title="loopedslider" src="http://www.alyenstudio.com/wp-content/2010/05/loopedslider-590x308.jpg" alt="loopedslider 590x308 As melhores Image Galleries & Sliders em jQuery" width="590" height="308" /></p><h4><a href="http://nivo.dev7studios.com/">Nivo Slider</a></h4><p><a href="http://nivo.dev7studios.com/">Programa demonstrativo</a> | <a href="http://dev7studios.com/downloads/22">Baixar</a><br /> Nivo Slider é um plugin jQuery de novo com excelentes recursos: 9 efeitos de transição original, teclado de navegação simples e limpa.</p><p><img class="aligncenter size-thumbnail wp-image-474" title="nivoslider" src="http://www.alyenstudio.com/wp-content/2010/05/nivoslider-590x324.jpg" alt="nivoslider 590x324 As melhores Image Galleries & Sliders em jQuery" width="590" height="324" /></p><h4><a href="http://active.tutsplus.com/freebies/exclusive/exclusive-freebie-the-piecemaker-xml-gallery/">Piecemaker Galeria XML </a></h4><p><a href="http://activetuts.s3.amazonaws.com/freebies/003_pieceMaker/piecemaker/index.html">Programa demonstrativo</a> | <a href="http://activetuts.s3.amazonaws.com/freebies/003_pieceMaker/piecemaker.zip">Baixar</a><br /> Piecemaker é uma fonte aberta 3D Flash galeria rotator imagem.</p><p><img class="aligncenter size-full wp-image-458" title="jquery-slideshows" src="http://www.alyenstudio.com/wp-content/2010/05/jquery-slideshows.jpg" alt="jquery slideshows As melhores Image Galleries & Sliders em jQuery" width="500" height="281" /></p><h4><a href="http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/">Pretty Photo</a></h4><p><a href="http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/">Programa demonstrativo</a> | <a href="http://www.no-margin-for-errors.com/demos/prettyPhoto-jquery-lightbox-clone/prettyPhoto_compressed_2.5.6.zip">Baixar</a><br /> prettyPhoto é um clone jQuery lightbox base. Não só as imagens ele suporta, mas também adicionar suporte para vídeos, flash, YouTube, iFrames.</p><p><img class="aligncenter size-thumbnail wp-image-475" title="prettyPhoto" src="http://www.alyenstudio.com/wp-content/2010/05/prettyPhoto-590x329.jpg" alt="prettyPhoto 590x329 As melhores Image Galleries & Sliders em jQuery" width="590" height="329" /></p><h4><a href="http://www.slidedeck.com/">Slide Deck</a></h4><p><a href="http://www.slidedeck.com/">Programa demonstrativo</a> | <a href="http://www.slidedeck.com/download">Baixar</a><br /> Slide Deck é um fácil de implementar com um grande projeto.</p><p><img class="aligncenter size-thumbnail wp-image-476" title="slidedeck" src="http://www.alyenstudio.com/wp-content/2010/05/slidedeck-590x288.jpg" alt="slidedeck 590x288 As melhores Image Galleries & Sliders em jQuery" width="590" height="288" /></p><h4><a href="http://jquery.com/demo/thickbox/">Thickbox</a></h4><p><a href="http://jquery.com/demo/thickbox/#examples">Programa demonstrativo</a> | <a href="http://jquery.com/demo/thickbox/thickbox-code/thickbox.js">Baixar</a><br /> ThickBox é escrito em JavaScript. Sua função é mostrar uma única imagem, várias imagens, conteúdo inline, iframed conteúdo ou conteúdo servido através de AJAX em um modal híbrida.</p><p><img class="aligncenter size-thumbnail wp-image-477" title="thickbox" src="http://www.alyenstudio.com/wp-content/2010/05/thickbox-590x303.jpg" alt="thickbox 590x303 As melhores Image Galleries & Sliders em jQuery" width="590" height="303" /></p><h4><a href="http://www.simplesli.de/">Simples Slide</a></h4><p><a href="http://www.simplesli.de/">Programa demonstrativo</a> | <a href="http://www.simplesli.de/files/jquery.simpleSlide.js.zip">Baixar</a><br /> Simples Slide é um plugin jQuery slideshow. É fácil de usar, pequeno e flexível.</p><p><img class="aligncenter size-thumbnail wp-image-478" title="SimpleSlide" src="http://www.alyenstudio.com/wp-content/2010/05/SimpleSlide-590x343.jpg" alt="SimpleSlide 590x343 As melhores Image Galleries & Sliders em jQuery" width="590" height="343" /></p><h4><a href="http://www.yoxigen.com/yoxview/">Yoxview</a></h4><p><a href="http://www.yoxigen.com/yoxview/Default.aspx">Programa demonstrativo</a> | <a href="http://www.yoxigen.com/yoxview/releases/1.85/jquery.yoxview-1.85.zip">Baixar</a><br /> YoxView é uma imagem livre e visualizador de vídeos para websites. Ele é escrito em JavaScript usando jQuery e está disponível como um plugin do jQuery.</p><p><img class="aligncenter size-thumbnail wp-image-479" title="yoxview" src="http://www.alyenstudio.com/wp-content/2010/05/yoxview-590x316.jpg" alt="yoxview 590x316 As melhores Image Galleries & Sliders em jQuery" width="590" height="316" /></p><div id="TixyyLink">Fonte: <a href="http://www.hongkiat.com/blog/jquery-image-galleries-sliders-best-of/#ixzz0oNOjCcfX">jQuery Image Galleries &amp; Sliders – Best Of | Design</a></div> ]]></content:encoded> <wfw:commentRss>http://www.alyenstudio.com/codigos/jquery/as-melhores-image-galleries-sliders-em-jquery-457.html/feed</wfw:commentRss> <slash:comments>9</slash:comments> </item> <item><title>12 bancos de imagens gratuitos</title><link>http://www.alyenstudio.com/recursos/12-bancos-de-imagens-gratuitos-432.html</link> <comments>http://www.alyenstudio.com/recursos/12-bancos-de-imagens-gratuitos-432.html#comments</comments> <pubDate>Thu, 21 Jan 2010 10:46:31 +0000</pubDate> <dc:creator>Alyen</dc:creator> <category><![CDATA[Recursos]]></category> <category><![CDATA[banco de imagens]]></category> <category><![CDATA[gratuito]]></category> <category><![CDATA[imagens]]></category> <category><![CDATA[morguefile]]></category> <category><![CDATA[public domain photos]]></category><guid isPermaLink="false">http://www.alyenstudio.com/?p=432</guid> <description><![CDATA[Em muitas ocasiões precisamos uma imagem para realizar um trabalho ou bem uma apresentação e não damos com ela. Em Internet há numerosas fontes de pagamento à hora de falar de imagens, no entanto também há opções gratuitas. Tal e como destacam em MuyPymes deixamos nada menos que uma dúzia de opções: Stock.xchng: totalmente gratuito, [...]]]></description> <content:encoded><![CDATA[<div id="attachment_433" class="wp-caption aligncenter" style="width: 600px"><img class="size-thumbnail wp-image-433" title="masthead" src="http://www.alyenstudio.com/wp-content/2010/01/masthead-590x122.gif" alt="masthead 590x122 12 bancos de imagens gratuitos" width="590" height="122" /><p class="wp-caption-text">Permite baixar as imagens sem ter que se registrar.</p></div><p>Em  muitas ocasiões precisamos uma imagem para realizar um trabalho ou  bem uma apresentação e não damos com ela. Em  Internet há numerosas  fontes de  pagamento à hora de  falar de  imagens, no entanto também há  opções gratuitas.</p><p>Tal e como destacam em MuyPymes deixamos nada menos  que uma dúzia de  opções:</p><ul><li><a href="http://www.sxc.hu/" target="_blank">Stock.xchng</a>: totalmente gratuito, numerosas opções de  busca e uso</li><li><a href="http://www.morguefile.com/" target="_blank">MorgueFile</a>: Permite baixar as imagens sem ter que se registrar  ainda que tem  algumas limitações de  uso das instantâneas.</li><li><a href="http://www.openphoto.net/" target="_blank">OpenPhoto</a>: Só exigem que cites o nome do autor e a fonte para utilizar  as imagens  em  qualquer trabalho.</li><li><a href="http://www.photorack.net/" target="_blank">Photo Rack</a>: Se precisas fotos  livres de  qualquer temática podes encontrá-las em   Photo Rack com seu  potente procurador.</li><li><a href="http://www.unprofound.com/" target="_blank">Unprofound</a>: Fotografias mais profissionais com  grande acabamento</li><li><a href="http://freerangestock.com/" target="_blank">Freerange Stock</a>: Necessário o registo e uma  ampla galeria de  imagens.</li><li><a href="http://www.freedigitalphotos.net/" target="_blank">FreeDigitalPhotos</a>: Fotografias de   grande resolução para cercas publicitárias ou projetos  comerciais.</li><li><a href="http://www.freefoto.com/">FreeFoto</a>: Podemos utilizar sempre que seja sem fins comerciais.</li><li><a href="http://www.freepixels.com/" target="_blank">FreePixels</a>: Número de  imagens é limitado, as fotografias são de  grande  resolução e  qualidade.</li><li><a href="http://www.public-domain-photos.com/" target="_blank">Public Domain Photos</a>: Mais de  15.000  fotografias de  todo tipo podem encontrar-se neste  arquivo público.</li><li><a href="http://www.designpacks.com/" target="_blank">DesingPacks</a>: As imagens deste banco têm uma alta qualidade mas sem  demasiada oferta.  Podem-se descarregar packs de  15 em  15</li><li><a href="http://www.everystockphoto.com/" target="_blank">Everystockphoto</a>: Este banco de  imagens que recopila fotografias de   outros arquivos  reúne mais de  5 milhões de  instantâneas.</li></ul><p>Fonte: <a href="http://www.noticias3d.com/noticia.asp?idnoticia=37336" target="_blank">noticias3d</a></p> ]]></content:encoded> <wfw:commentRss>http://www.alyenstudio.com/recursos/12-bancos-de-imagens-gratuitos-432.html/feed</wfw:commentRss> <slash:comments>3</slash:comments> </item> <item><title>Sexy Page Curls &#8211; Dobrar as esquinas com jQuery</title><link>http://www.alyenstudio.com/codigos/jquery/sexy-page-curls-dobrar-as-esquinas-com-jquery-148.html</link> <comments>http://www.alyenstudio.com/codigos/jquery/sexy-page-curls-dobrar-as-esquinas-com-jquery-148.html#comments</comments> <pubDate>Mon, 26 Jan 2009 09:20:38 +0000</pubDate> <dc:creator>Alyen</dc:creator> <category><![CDATA[jQuery]]></category> <category><![CDATA[flash]]></category> <category><![CDATA[html]]></category> <category><![CDATA[imagens]]></category> <category><![CDATA[Javascript]]></category> <category><![CDATA[page curls]]></category> <category><![CDATA[sexy page curls]]></category><guid isPermaLink="false">http://www.alyenstudio.com/?p=148</guid> <description><![CDATA[Estes efeitos normalmete era gerado mediante javascript + imagens + .sfw (flash). Sexy Page Curls, mostra outra alternativa, esta vez baseada em Jquery, com um efeito tão atraente como os demais e com o mesmo fim. Link Sexy Page Curls Via webmasterlibre]]></description> <content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-149" title="sexy curl plugin" src="http://www.alyenstudio.com/wp-content/2009/01/sexycurlplugin.jpg" alt="sexycurlplugin Sexy Page Curls   Dobrar as esquinas com jQuery" width="500" height="200" />Estes efeitos normalmete era gerado mediante<strong> javascript</strong> + <strong>imagens</strong> + <strong>.sfw</strong> (flash). Sexy Page Curls, mostra outra alternativa, esta vez baseada em <strong>Jquery</strong>, com um efeito tão atraente como os demais e com o mesmo fim.</p><p>Link <a href="http://www.elliottkember.com/sexy_curls.html" target="_blank">Sexy Page Curls</a></p><p>Via <a href="http://www.webmasterlibre.com/2009/01/20/doblando-la-esquina-a-tu-pagina-web-con-jquery/" target="_blank">webmasterlibre </a></p> ]]></content:encoded> <wfw:commentRss>http://www.alyenstudio.com/codigos/jquery/sexy-page-curls-dobrar-as-esquinas-com-jquery-148.html/feed</wfw:commentRss> <slash:comments>2</slash:comments> </item> <item><title>jQuery popeye &#8211; Caixas lightbox, para ampliar conteúdo sem perder espaço ou montar galerias</title><link>http://www.alyenstudio.com/codigos/javascript/jquery-popeye-caixas-lightbox-para-ampliar-conteudo-sem-perder-espaco-ou-montar-galerias-96.html</link> <comments>http://www.alyenstudio.com/codigos/javascript/jquery-popeye-caixas-lightbox-para-ampliar-conteudo-sem-perder-espaco-ou-montar-galerias-96.html#comments</comments> <pubDate>Thu, 27 Nov 2008 19:00:48 +0000</pubDate> <dc:creator>Alyen</dc:creator> <category><![CDATA[Javascript]]></category> <category><![CDATA[AlyenStudio]]></category> <category><![CDATA[css]]></category> <category><![CDATA[demo]]></category> <category><![CDATA[div]]></category> <category><![CDATA[etiqueta]]></category> <category><![CDATA[imagens]]></category><guid isPermaLink="false">http://www.alyenstudio.com/?p=96</guid> <description><![CDATA[Se você esta cansado de usar sempre os mesmos efeitos de lightbox no conteúdo de seus artigos ou em certas seções em particular, jQuery Popeye será uma alternativa peculiar. O jQuery Popeye foi inspirada nos tradicionais lightbox, basicamente não pretende obter os mesmos resultados. Tem características muito particulares, e é realmente muito atraente. jQuery Popeye [...]]]></description> <content:encoded><![CDATA[<p style="text-align: center;"><img class="aligncenter size-full wp-image-355" title="jquwrypopeye" src="http://www.alyenstudio.com/wp-content/2008/11/jquwrypopeye1.jpg" alt="jquwrypopeye1 jQuery popeye   Caixas lightbox, para ampliar conteúdo sem perder espaço ou montar galerias" width="475" height="268" /></p><p>Se você esta cansado de usar sempre os mesmos efeitos de lightbox no conteúdo de seus artigos ou em certas seções em particular, jQuery Popeye será uma alternativa peculiar. O <a href="http://herr-schuessler.de/blog/jquerypopeye-an-inline-lightbox-alternative/" target="_blank">jQuery Popeye</a> foi inspirada nos tradicionais lightbox, basicamente não pretende obter os mesmos resultados. Tem características muito particulares, e é realmente muito atraente. <a href="http://herr-schuessler.de/blog/jquerypopeye-an-inline-lightbox-alternative/" target="_blank">jQuery Popeye</a> poderá ser útil para montar galerias de imagens em seção realmente reduzidas, ampliar conteúdo de nossos post adicionando muitas imagens sem danar o desenho de nosso blog ou site, adicionar quantidade de imagens mediante Caixas de lightbox e não de forma individual, permite adicionar uma pequena descrição a cada imagem na parte inferior de nossa caixa utilizando o atributo ALT e variar um pouco o efeito, já que em vez de lightbox se assemelham mas aos pop-up.</p><p><span id="more-96"></span></p><p><a href="http://www.alyenstudio.com/demos/jquery_popeye/" target="_blank">Demo</a> &#8211; <a class="downloadlink" href="http://www.alyenstudio.com/wp-content/plugins/download-monitor/download.php?id=1" title="Versãodemo alyenstudio download feito 1550  vezes" >jQuery.popeye demo (1550)</a> &#8211; Articulo Original <a href="http://herr-schuessler.de/blog/jquerypopeye-an-inline-lightbox-alternative/" target="_blank">jQuery.popeye &#8211; an inline lightbox alternative </a></p><p>Para que funcione corretamente precisaremos baixar as seguintes librerias. jquery.popeye-0.2.1.js (incluida no pack original), ademais deveremos descarregar jquery.easing.1.3.js junto com jquery-1.2.6.js (Incluidas na minha demo). Uma vez com os arquivos deveremos realizar o links correspondente desde nosso arquivo.</p><p>Copiando e colando o seguinte código dentro de nossa etiqueta:</p><pre class="brush: jscript; title: ; notranslate">&lt;script type=&quot;text/javascript&quot; src=&quot;lib/jquery-1.2.6.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;lib/jquery.easing.1.3.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;lib/jquery.popeye-0.2.1.js&quot;&gt;&lt;/script&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
&lt;!--//&lt;![CDATA[

$(document).ready(function () {
var options1 = {
easing:     'easeInOutCirc'
}
var options2 = {
direction:  'right',
duration:   230
}

$('#popeye1').popeye(options1);
$('#popeye2').popeye(options2);
});

//]]&gt;--&gt;
&lt;/script&gt;</pre><p>Tambien deveremos adicionar os links das folhas de  estilo.</p><pre class="brush: xml; title: ; notranslate">
&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/jquery.popeye.css&quot; media=&quot;screen&quot; /&gt;
&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;css/styling.css&quot; media=&quot;screen&quot; /&gt;
</pre><p>Por ultimo: Começamos a montar nossas Caixas com as imagenes</p><pre class="brush: xml; title: ; notranslate">&lt;h2&gt;Demo 1 - Popeye (Float:Left)&lt;/h2&gt;
&lt;!-- [EXEMPLO DEMO 1 ] begin --&gt;
&lt;div id=&quot;popeye1&quot; class=&quot;popeye popeye-hasjs next&quot;&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;images/1large.jpg&quot;&gt;&lt;img src=&quot;images/1small.jpg&quot; alt=&quot;Descripcion: Demo de Popeye jQuery, testado por www.alyenstudio.com. Adicionar descrição utilizando o atributo (ALT)&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;images/2large.jpg&quot;&gt;&lt;img src=&quot;images/2small.jpg&quot; alt=&quot;Descripcion: Demo de Popeye jQuery, testado por www.alyenstudio.com. Adicionar descrição utilizando o atributo (ALT)&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;images/3large.jpg&quot;&gt;&lt;img src=&quot;images/3small.jpg&quot; alt=&quot;Descripcion: Demo de Popeye jQuery, testado por www.alyenstudio.com. Adicionar descrição utilizando o atributo (ALT)&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;!-- [FIN EXEMPLO DEMO 1] end --&gt;
&lt;div style=&quot;clear:both;&quot;&gt;
&lt;h2&gt;Demo 2 - Popeye (Float:Right)&lt;/h2&gt;
&lt;!-- [EXEMPLO DEMO 2 ] begin --&gt;
&lt;div id=&quot;popeye2&quot; class=&quot;popeye&quot;&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;images/1large.jpg&quot;&gt;&lt;img src=&quot;images/1small.jpg&quot; alt=&quot;Descripcion: Demo de Popeye jQuery, testado por www.alyenstudio.com. Adicionar descrição utilizando o atributo (ALT)&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;images/2large.jpg&quot;&gt;&lt;img src=&quot;images/2small.jpg&quot; alt=&quot;Descripcion: Demo de Popeye jQuery, testado por www.alyenstudio.com. Adicionar descrição utilizando o atributo (ALT)&quot; /&gt;&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;images/3large.jpg&quot;&gt;&lt;img src=&quot;images/3small.jpg&quot; alt=&quot;Demo de Popeye jQuery, testado por www.alyenstudio.com. Adicionar descrição utilizando o atributo (ALT)&quot; /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;		 &lt;!-- [FIM EXEMPLO DEMO 2] end --&gt;</pre><p>Qualquer dúvida é so deixar um comentário.</p> ]]></content:encoded> <wfw:commentRss>http://www.alyenstudio.com/codigos/javascript/jquery-popeye-caixas-lightbox-para-ampliar-conteudo-sem-perder-espaco-ou-montar-galerias-96.html/feed</wfw:commentRss> <slash:comments>3</slash:comments> </item> <item><title>ImageFlow, galeria em Javascript para criar a sua Coverflow</title><link>http://www.alyenstudio.com/recursos/galerias/imageflow-galeria-em-javascript-para-criar-a-sua-coverflow-78.html</link> <comments>http://www.alyenstudio.com/recursos/galerias/imageflow-galeria-em-javascript-para-criar-a-sua-coverflow-78.html#comments</comments> <pubDate>Fri, 14 Nov 2008 11:43:28 +0000</pubDate> <dc:creator>Alyen</dc:creator> <category><![CDATA[Galerias]]></category> <category><![CDATA[Javascript]]></category> <category><![CDATA[ao]]></category> <category><![CDATA[aspecto]]></category> <category><![CDATA[chamar]]></category> <category><![CDATA[demo]]></category> <category><![CDATA[div]]></category> <category><![CDATA[etiqueta]]></category> <category><![CDATA[galeria]]></category> <category><![CDATA[galeria de fotos]]></category> <category><![CDATA[galeria em flash]]></category> <category><![CDATA[galeria google]]></category> <category><![CDATA[galeria javascript]]></category> <category><![CDATA[garante]]></category> <category><![CDATA[ImageFlow]]></category> <category><![CDATA[imageflow galeria]]></category> <category><![CDATA[imagens]]></category> <category><![CDATA[indo]]></category> <category><![CDATA[javascript coverflow]]></category> <category><![CDATA[loading images]]></category> <category><![CDATA[lt]]></category> <category><![CDATA[MooFlow]]></category> <category><![CDATA[nossa]]></category> <category><![CDATA[script]]></category> <category><![CDATA[uma]]></category><guid isPermaLink="false">http://www.alyenstudio.com/?p=78</guid> <description><![CDATA[ImageFlow é uma bonita galeria feita em Javascript e a qual por seu aspecto sem dúvida ficaria bem em qualquer projeto online. ImageFlow é muito similar em vários aspectos com MooFlow ainda que conta com algumas diferenças. ImageFlow nos permite navegar entre as imagens utilizando o scroll de nosso mouse ou bem utilizando um sistema [...]]]></description> <content:encoded><![CDATA[<p style="text-align: center;"><img class="aligncenter size-full wp-image-361" title="imageflow" src="http://www.alyenstudio.com/wp-content/2008/11/imageflow1.jpg" alt="imageflow1 ImageFlow, galeria em Javascript para criar a sua Coverflow" width="459" height="149" /></p><p><a href="http://imageflow.finnrudolph.de/">ImageFlow</a> é uma bonita galeria feita em Javascript e a qual por seu aspecto sem dúvida ficaria bem em qualquer projeto online. <a href="http://imageflow.finnrudolph.de/">ImageFlow</a> é muito similar em vários aspectos com MooFlow ainda que conta com algumas diferenças. <a href="http://imageflow.finnrudolph.de/">ImageFlow</a> nos permite navegar entre as imagens utilizando o scroll de nosso mouse ou bem utilizando um sistema de navegação integrado à galeria e o qual moveremos esta vez, de forma manual com nosso mouse. Isto permite ao usuário deslocar entre cada uma das imagens, indo de um lado a outro. Também fizeram muitas melhoras com respeito ao div da galeria, o que garante que o deslocamento produzido por nosso mouse, só se produza ao estar sobre o div que contém à mesma. Sua utilização é sumamente fácil e os efeitos que fazem à galeria são muito agradáveis.</p><p>Ver <a href="http://www.alyenstudio.com/demos/imageflow/">demo</a> &#8211; <a href="http://finnrudolph.de/ImageFlow/Download" target="_blank">Download</a> demo.</p><h3>Instalacion:</h3><p>Baixamos o script <a href="http://imageflow.finnrudolph.de/">ImageFlow</a>, o primeiro que faremos será realizar o chamar o script, Copiamos e colamos o seguinte código dentro de nossa etiqueta &lt; head &gt;</p><pre class="brush: jscript; title: ; notranslate">&lt;script src=&quot;js/imageflow.js&quot; type=&quot;text/javascript&quot;&gt;&lt;!--mce:0--&gt;&lt;/script&gt;</pre><p>agregamos um pouco de estilo</p><pre class="brush: css; title: ; notranslate">
&lt;!--
img {
    position:absolute;
    top:0px;
    border:none;
}
h1 {
    text-align:center;
}
a{
    color:#fff;
}
.none{
    visibility:hidden;
}
.none div{
    display:none;
}
.clear{
    clear:both;
}
#images{
    visibility:hidden;
}
#loading{
    margin-top:50px;
    text-align:center;
    width:100%;
}
#loading img{
    margin-top:10px;
    position:relative;
}
#captions{
    position:relative;
    text-align:center;
    z-index:10000;
}
#scrollbar{
    visibility:hidden;
    position:relative;
    border-bottom:1px solid #b3b3b3;
    z-index:10001;
}
#scrollbar_slider{
    position:absolute;
    margin-top:-7px;
    margin-left:-7px;
    z-index:10002;
    background-image:url(slider.png);
    background-repeat:no-repeat;
    width:14px;
    height:14px;
}
#imageflow{
background-color:#000;
    margin-left:350px;
    text-align:left;
        color: #fff;
}
--&gt;
</pre><p>Por ultimo a estrutura de nossa galeria</p><pre class="brush: xml; title: ; notranslate">
&lt;div id=&quot;imageflow&quot;&gt;
&lt;div id=&quot;loading&quot;&gt;
        &lt;strong&gt;Loading images&lt;/strong&gt;
        &lt;img src=&quot;loading.gif&quot; alt=&quot;loading&quot; width=&quot;208&quot; height=&quot;13&quot; /&gt;&lt;/div&gt;
&lt;div id=&quot;images&quot;&gt;
        &lt;img src=&quot;img/img001.png&quot; alt=&quot;Image 1&quot; /&gt;
        &lt;img src=&quot;img/img002.png&quot; alt=&quot;Image 2&quot; /&gt;
        &lt;img src=&quot;img/img003.png&quot; alt=&quot;Image 3&quot; /&gt;
        &lt;img src=&quot;img/img002.png&quot; alt=&quot;Image 4&quot; /&gt;
        &lt;img src=&quot;img/img003.png&quot; alt=&quot;Image 5&quot; /&gt;
        &lt;img src=&quot;img/img001.png&quot; alt=&quot;Image 6&quot; /&gt;
        &lt;img src=&quot;img/img002.png&quot; alt=&quot;Image 7&quot; /&gt;
        &lt;img src=&quot;img/img003.png&quot; alt=&quot;Image 8&quot; /&gt;
        &lt;img src=&quot;img/img002.png&quot; alt=&quot;Image 9&quot; /&gt;
        &lt;img src=&quot;img/img001.png&quot; alt=&quot;Image 10&quot; /&gt;&lt;/div&gt;
&lt;div id=&quot;scrollbar&quot;&gt;&lt;/div&gt;
&lt;/div&gt;
</pre><p>Fonte: <a href="http://xyberneticos.com/index.php/2007/12/18/imageflow-otra-galeria-en-javascript-para-crear-tu-coverflow/">Xyberneticos</a></p> ]]></content:encoded> <wfw:commentRss>http://www.alyenstudio.com/recursos/galerias/imageflow-galeria-em-javascript-para-criar-a-sua-coverflow-78.html/feed</wfw:commentRss> <slash:comments>46</slash:comments> </item> </channel> </rss>
<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: enhanced
Database Caching 6/47 queries in 0.015 seconds using disk: basic
Object Caching 1056/1162 objects using disk: basic

Served from: www.alyenstudio.com @ 2012-01-12 14:01:36 -->
