Staff en línea
Últimos temas
[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Origin10[html] cambia el popup de notificación de mensaje privado por uno profesional
por Lelu Jue Nov 28, 2019 7:09 am

[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Origin10[html]Menú de enlaces simple
por Lelu Jue Nov 28, 2019 6:30 am

[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Origin10[html]Menú dinámico
por Lelu Jue Nov 28, 2019 6:11 am

[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Origin10[html]Escaparate de imágenes sencillo
por Lelu Jue Nov 28, 2019 6:02 am

[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Origin10[Duda] ModernBB vale la pena?
por mrsrz Miér Nov 27, 2019 9:57 am

[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Origin10[Ocio] Contemos hasta el 5000
por Fibo Miér Nov 27, 2019 9:19 am

 :: Modifica tu foro :: Templetes/HTML

[Templates] Añadir un Scrollbar en el Widget Ultimos Temas
Tema iniciado por y Añadir a favoritos

#1
[Templates] Añadir un Scrollbar en el Widget Ultimos Temas 
el Dom Sep 03, 2017 12:35 pm
[codebox]Con éste code podrán añadir un Scrollbar al Widget de Ultimos Temas, eliminando el scroll automático y facilitando la lectura de ultimos temas.
[Templates] Añadir un Scrollbar en el Widget Ultimos Temas Wc11
[/codebox]

Primero, buscar el template mod_recent_topics y reemplazarlo todo por éste:
(PA > Visualización > Templates > Portal)

[hidecode]
Código:
        <!-- BEGIN scrolling_row -->
            {MARQUEE_JS_SRC}
            <table class="forumline genmed" width="100%" border="0" cellspacing="1" cellpadding="0">
                    <tr>
                            <td class="catLeft" height="25">
                                    <span class="genmed module-title">{L_RECENT_TOPICS}</span>
                            </td>
                    </tr>
                    <tr>
                            <td class="row1" style="height:{SCROLL_HEIGHT}px;">
                                <div class="marquee" align="left" data-direction='{SCROLL_WAY}' data-duration='{SCROLL_DELAY}' data-pauseOnHover="true" style="overflow:hidden;height:{SCROLL_HEIGHT}px;">
                                    <!-- BEGIN recent_topic_row -->
                                        »&nbsp;<a href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a><br />
                                        <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}&nbsp;
     
                                        <!-- BEGIN switch_poster -->
                                        <a href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a><br /><br />
                                        <!-- END switch_poster -->
     
                                        <!-- BEGIN switch_poster_guest -->
                                        {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}<br /><br />
                                        <!-- END switch_poster_guest -->
                                    <!-- END recent_topic_row -->
                                </div>
                            </td>
                    </tr>
            </table>
            <script>
                $(".marquee").marquee();
            </script>
        <!-- END scrolling_row -->
        <!-- BEGIN classical_row -->
        <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
          <tr>
              <td class="catHead" height="25"><span class="genmed"><b><center>{L_RECENT_TOPICS}</center></b></span></td>
          </tr>
          <tr>
              <td class="row1" align="left"><div id="recent_topic_list" class="gensmall">
              <!-- BEGIN recent_topic_row -->
              » <a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a><br /><img src="{ICON_TIME}" alt="" />{BY}&nbsp;
     
              <!-- BEGIN switch_poster -->
              <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
              <!-- END switch_poster -->
     
              <!-- BEGIN switch_poster_guest -->
              {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
              <!-- END switch_poster_guest -->
     
              {ON} {classical_row.recent_topic_row.S_POSTTIME}<br /><br />
     
              <!--
              <a href="{classical_row.recent_topic_row.U_POSTER}">{classical_row.recent_topic_row.S_POSTER}</a> {ON} {classical_row.recent_topic_row.S_POSTTIME}<br /><br />
              -->
              <!-- END recent_topic_row -->
              </div></td>
          </tr>
        </table>
        <!-- END classical_row -->
[/hidecode]

Luego Insertar el siguiente CSS:

[hidecode]
Código:
        #recent_topic_list {
          height:200px;
          overflow-y:auto;
        }
     
        #recent_topic_list::-webkit-scrollbar {
          width:6px;
        }
     
        #recent_topic_list::-webkit-scrollbar-track {
          background:rgba(0, 0, 0, 0.1);
        }
     
        #recent_topic_list::-webkit-scrollbar-thumb {
          background:#999;
        }
[/hidecode]

Luego en :el Widger de últimos temas - Modificar - Activar el Scroll de los Temas: No.
Y guardamos cambios.

YoshiGM
YoshiGM

¿Que estoy pensando? :

Renovando YFC [table class=fecha_up][td]Se modifico:16/11/19 - 11:07 hrs. [/td][/table]


Banner en temas :

https://i.servimg.com/u/f19/13/45/80/80/banner10.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #555


Mensajes :

1267


Puntos :

1688


Me gusta :

251


ingreso :

17/12/2014


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


https://www.yoshifansclub.net/forum

Volver arriba Ir abajo

Responder Mensaje privado

 En la misma categoria

 Temas relacionados

 :: Modifica tu foro :: Templetes/HTML

Permisos de este foro:
No puedes responder a temas en este foro.