Storm Design | Templates Exclusivos | Tutoriais de Web Design | Peça seu Template Exclusivo Grátis

Slides Personalizados


vc pode postar ate 6 imagens sem ocupar espaço com efeito de rolagem horizontal servindo para gadget ou postagem normal.


Vá em Design - Elementos da Página - Adicionar um Gadget - HTML/Javascript.
Copie o código abaixo:

<link rel="Stylesheet" type="text/css" href="http://gbscripts.webs.com/SmoothDivScroll-1.2/css/smoothDivScroll.css" /><br />
<style type="text/css"><br />
    #makeMeScrollable<br />
    {    <span style="color: #e69138;">width:400px</span>;<br />
        <span style="color: #e69138;">height:390px</span>;         position: relative;    }<br />
    #makeMeScrollable div.scrollableArea img<br />
    {    position: relative;<br />
        float: left;<br />
        margin: 0;<br />
        padding-right: 5px;}<br />
</style><br />
<div id="makeMeScrollable"><br />
    <a href=" <span style="color: #38761d;">LINK OPCIONAL </span>" target="_blank"><img src=" <span style="color: #e06666;">URL IMAGEM</span> " <span style="color: #e69138;">height="270</span>"border="0"/></a><br />
    <a href=" <span style="color: #38761d;">LINK OPCIONAL</span> " target="_blank"><img src=" <span style="color: #e06666;">URL IMAGEM</span> " <span style="color: #e69138;">height="270</span>"border="0"/></a><br />
    <a href=" <span style="color: #38761d;">LINK OPCIONAL</span> " target="_blank"><img src=" <span style="color: #e06666;">URL IMAGEM</span> " <span style="color: #e69138;">height="270</span>"border="0"/></a><br />
    <a href=" <span style="color: #38761d;">LINK OPCIONAL</span> " target="_blank"><img src=" <span style="color: #e06666;">URL IMAGEM</span> " <span style="color: #e69138;">height="270</span>"border="0"/></a>     <br />
    <a href=" <span style="color: #38761d;">LINK OPCIONAL</span> " target="_blank"><img src=" <span style="color: #e06666;">URL IMAGEM</span> " <span style="color: #e69138;">height="270</span>"border="0"/></a><br />
    <a href=" <span style="color: #38761d;">LINK OPCIONAL</span> " target="_blank"><img src=" <span style="color: #e06666;">URL IMAGEM</span> " <span style="color: #e69138;">height="270</span>"border="0"/></a> </div><br />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script><br />
<script src="http://gbscripts.webs.com/SmoothDivScroll-1.2/js/jquery-ui-1.8.18.custom.min.js" type="text/javascript"></script><br />
<script src="http://gbscripts.webs.com/SmoothDivScroll-1.2/js/jquery.mousewheel.min.js" type="text/javascript"></script><br />
<script src="http://gbscripts.webs.com/SmoothDivScroll-1.2/js/jquery.smoothdivscroll-1.2-min.js" type="text/javascript"></script><br />
<script type="text/javascript"><br />
    $(document).ready(function () {<br />
        $("div#makeMeScrollable").smoothDivScroll({<br />
            mousewheelScrolling: true,<br />
            manualContinuousScrolling: true,<br />
            visibleHotSpotBackgrounds: "always",<br />
            autoScrollingMode: "onstart"});});   <br />
</script>

Agora é so configurar de acordo com suas imagens:

LINK OPCIONAL = algum link se deseja redirecionar a imagem.
URL IMAGEM = link do url da sua imagem.
WIDHT = Largura acordo com o tamanho da sua imagem.
HEIGHT = Altura de acordo com o tamanho da sua imagem.

0 comentários:

Postar um comentário