Slidebar com imagens

Olá!
Coloquei o widget de "Slidebar com imagens" e não está funcionando corretamente:



O resultado era para ser este:



O tutorial que segui foi esse: https://ajuda.forumeiros.com/t73793-tutorial-slidebar-com-imagens
Meu fórum: http://winxclubfairies.forumeiros.com/

Up

Saudações,

Por gentileza, ative o código em seu fórum?
É bom ver o erro ativo no fórum.

Até mais.
Sennior

Coloquei o widget nesse link: http://winxclubfairies.forumeiros.com/portal?pid=5

Olá!

Pedimos desculpa, mas isso é porquê os códigos responsáveis pela personalização não se encontram mais disponíveis. Como eles trocaram de domínio, o código novo seria esse:

Código:

   
      <link rel="stylesheet" type="text/css"
          href="http://jquerytools.github.io/media/css/scrollable-horizontal.css" />
    <link rel="stylesheet" type="text/css"
          href="http://jquerytools.github.io/media/css/scrollable-buttons.css" />
    <script type="text/javascript" src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
    <!-- HTML structures --><div style="margin:0 auto; width: 634px; height:120px;">
    <!-- "previous page" action -->
    <a class="prev browse left"></a>

    <!-- root element for scrollable --><div class="scrollable" id="scrollable">

      <!-- root element for the items -->
      <div class="items">

        <!-- grupo 1 -->
        <div>
          <a href="LINK_1"><img src="IMAGEM_1" title="TITULO_1" /></a>
            <a href="LINK_2"><img src="IMAGEM_2" title="TITULO_2" /></a>
        <a href="LINK_3"><img src="IMAGEM_3" title="TITULO_3" /></a>
            <a href="LINK_4"><img src="IMAGEM_4" title="TITULO_4" /></a>
        </div>
    <!--Fim do grupo 1-->
        <!-- grupo 2 -->
        <div>
              <a href="LINK_5"><img src="IMAGEM_5" title="TITULO_5" /></a>
            <a href="LINK_6"><img src="IMAGEM_6" title="TITULO_6" /></a>
      <a href="LINK_7"><img src="IMAGEM_7" title="TITULO_7" /></a>
            <a href="LINK_8"><img src="IMAGEM_8" title="TITULO_8" /></a>
        </div>
    <!--  fim do grupo 2 -->
        <!-- grupo 3 -->
        <div>
                <a href="LINK_9"><img src="IMAGEM_9" title="TITULO_9" /></a>
            <a href="LINK_10"><img src="IMAGEM_10" title="TITULO_10" /></a>
      <a href="LINK_10"><img src="IMAGEM_10" title="TITULO_10" /></a>
            <a href="LINK_10"><img src="IMAGEM_10" title="TITULO_10" /></a>
        </div>
    <!-- fim do grupo 3 -->

    <!-- Adicione aqui mais códigos-->

      </div>

    </div>

    <!-- "next page" action -->
    <a class="next browse right"></a>
    </div>
    <!-- javascript coding -->
    <script>
    jQuery(function() {
      // initialize scrollable
      jQuery(".scrollable").scrollable();
    });
    </script>

Irei me responsabilizar para que o tutorial seja corrigido.

Atenciosamente.

As setas não estão aparecendo

Olá!

Troque o código por este, só falta colocar os links

Código:

     
          <link rel="stylesheet" type="text/css"
              href="http://jquerytools.github.io/media/css/scrollable-horizontal.css" />
        <link rel="stylesheet" type="text/css"
              href="http://jquerytools.github.io/media/css/scrollable-buttons.css" />
        <script type="text/javascript" src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
        <!-- HTML structures --><div style="margin:0 auto; width: 634px; height:120px;">
        <!-- "previous page" action -->
        <a class="prev browse left"></a>

        <!-- root element for scrollable --><div class="scrollable" id="scrollable">

          <!-- root element for the items -->
          <div class="items">

            <!-- grupo 1 -->
            <div>
              <a href="LINK_1"><img src="http://www.jogosdemeninas123.com/content/icons/winx-club-mermaid-layla-icon-1.jpg" title="TITULO_1" /></a>
                <a href="LINK_2"><img src="http://winxclub-games.com/games/images/kiko_winx_club_adventure.png" title="TITULO_2" /></a>
            <a href="LINK_3"><img src="http://www.bashbang.com/media/images/projects/winxmagixmaze_main.jpg" title="TITULO_3" /></a>
                <a href="LINK_4"><img src="http://www.winxhry.cz/data/attacktomagix.jpg" title="TITULO_4" /></a>
            </div>

        <!-- Adicione aqui mais códigos-->

          </div>

        </div>

        <!-- "next page" action -->
        <a class="next browse right"></a>
        </div>
        <!-- javascript coding -->
        <script>
        jQuery(function() {
          // initialize scrollable
          jQuery(".scrollable").scrollable();
        });
        </script>

Atenciosamente.

Acabo de colocar mais grupos de imagens, assim resolveu. Pode fechar o tópico.