Widget de "Últimos Temas" no quadro de anúncios

3 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 25.06.19 3:02

Detalhes da questão


Endereço do fórum: http://travelersrpg.forumeiros.com/
Versão do fórum: phpBB3

Descrição


Em um fórum antigo meu, utilizo de um JS para colocar o widget de último tema dentro de um quadro específico do quadro de anúncios. Ao replicar o código fazendo a alteraço no nome da div class, o mesmo não está puxando o widget.

Como podem ver no print:

Widget de "Últimos Temas" no quadro de anúncios YFQVVnK

Fórum em que utilizo o JS: http://bloodofvalyria.forumeiros.com/

Já deixo o codigo JS e o HTML usado no quadro de anúncio.

JavaScript

Código:
/* globals jQuery */
 
(function($) {
    'use strict';
 
    $(function() {
        var $container = $('.posts');
 
        if ($container.length === 0) {
            return;
        }
 
        var $marquee = $('#comments_scroll_div .marquee');
 
        if ($marquee.length === 0) {
            return;
        }
 
        var $parent = $container.closest('tr').find('div:last').parent();
 
        $parent
            .attr('id', 'comments-marquee')
            .html('')
            .css('overflow', 'hidden');
 
        $marquee = $marquee
            .marquee('destroy')
            .css('height', '255px')
            .css ('margin-left', '20px')
            .appendTo($parent)
            .marquee();
 
        $marquee.hover(function() {
            $marquee.marquee('pause');
        }, function() {
            $marquee.marquee('resume');
        });
    });
})(jQuery);

HTML
Código:
<div align="center">
                                        
 <div id="quadro">
                                          
 <div class="box">
                                          
 <div class="posts">
                      lorem                      
 </div>
                                          
 <div class="awards">
                          
 <table>
     <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Melhor Post</a>        
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Melhor RP</a>    
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
     <a href="http://travelersrpg.forumeiros.com/">Melhor Trama</a>    
 </div>
        
 </div>
        
 </td>
        
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Melhor Shipp</a>    
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Heroi</a>        
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Vilão</a>        
 </div>
        
 </div>
        
 </td>
        
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>    
 </table>
          
 </div>
                                          
 <div class="clima">
                                      
 <div class="clima-texto">
                New York, 27º<br /><strong>Sol, Primavera</strong>                
 </div>
                                
 </div>
                                          
 <div class="links">
                                  
 <table>
             <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
                        
 <td>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                  
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 </td>
                        
 <td>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                      
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                  
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 </td>
                        
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>            
 </table>
                          
 </div>
                                                  
 <div class="staff">
                              
 <table>
         <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
                
 <td>
                
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
                
 <div class="stafficon">
       <a href="http://travelersrpg.forumeiros.com/">MP</a>        
 </div>
                
 </div>
                
 </td>
                
 <td>
                
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
                
 <div class="stafficon">
        <a href="http://travelersrpg.forumeiros.com/">MP</a>        
 </div>
                
 </div>
            
 </td>
                
 <td>
                
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
                
 <div class="stafficon">
       <a href="http://travelersrpg.forumeiros.com/">MP</a>        
 </div>
                
 </div>
            
 </td>
                
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>        
 </table>
                  
 </div>
                                          
 <div class="avatar">
                                        
 <div class="avaimg">
                                     <script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<center><img src="'+link+'" alt=""></center>');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script>                        
 <div id="avatar">
                                                
 <center>
                         Carregando avatar...                        
 </center>
                                                
 </div>
                                                                                                                                                                                                                                                                              
 <div style="display: none;" class="g-2">
                                                                                                                                                                                                                                                                                            
 </div>
                                                                                                                                                                                                                                                                                      
 </div>
                                                                                                                                                                                                                                                                                    
 <div class="playername">
                                                                                                                                           Bem-vindo (a),<span id="link">{USERNAME}</span>                                                                                                                                        
 </div>
                                        
 </div>
                                  
 </div>
                                        
 </div>
</div>
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 26.06.19 3:10

Up up up
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Roevs 26.06.19 11:45

Olá,

Substitua o seu JS por esse

Código:
(function($){'use strict';$(function(){var $container=$('.posts');if($container.length===0){return}var $marquee=$('#comments_scroll_div .marquee');if($marquee.length===0){return}var $parent=$container.closest('tr').find('div:last').parent();$parent.attr('id','comments-marquee').html('').css('overflow','hidden');$marquee=$marquee.marquee('destroy').css('height','255px').css('margin-left','20px').appendTo($parent).marquee();$marquee.hover(function(){$marquee.marquee('pause')},function(){$marquee.marquee('resume')})})})(jQuery);

Depois substitua o seu HTML por esse

Código:
<div align="center">
                                        
 <div id="quadro">
                                          
 <div class="box">
                                          
 <div class="posts" id="comments-marquee" style="overflow: hidden;">
                      lorem                      
 </div>
                                          
 <div class="awards">
                          
 <table>
     <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Melhor Post</a>        
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Melhor RP</a>    
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
     <a href="http://travelersrpg.forumeiros.com/">Melhor Trama</a>    
 </div>
        
 </div>
        
 </td>
        
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Melhor Shipp</a>    
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Heroi</a>        
 </div>
        
 </div>
        
 </td>
        
 <td>
        
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
        
 <div class="awardicon">
       <a href="http://travelersrpg.forumeiros.com/">Vilão</a>        
 </div>
        
 </div>
        
 </td>
        
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>    
 </table>
          
 </div>
                                          
 <div class="clima">
                                      
 <div class="clima-texto">
                New York, 27º<br /><strong>Sol, Primavera</strong>                
 </div>
                                
 </div>
                                          
 <div class="links">
                                  
 <table>
             <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
                        
 <td>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                  
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 </td>
                        
 <td>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                      
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                        
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                  
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>            
 </div>
                    
 </td>
                        
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>            
 </table>
                          
 </div>
                                                  
 <div class="staff">
                              
 <table>
         <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
                
 <td>
                
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
                
 <div class="stafficon">
       <a href="http://travelersrpg.forumeiros.com/">MP</a>        
 </div>
                
 </div>
                
 </td>
                
 <td>
                
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
                
 <div class="stafficon">
        <a href="http://travelersrpg.forumeiros.com/">MP</a>        
 </div>
                
 </div>
            
 </td>
                
 <td>
                
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
                
 <div class="stafficon">
       <a href="http://travelersrpg.forumeiros.com/">MP</a>        
 </div>
                
 </div>
            
 </td>
                
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>        
 </table>
                  
 </div>
                                          
 <div class="avatar">
                                        
 <div class="avaimg">
                                     <script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<center><img src="'+link+'" alt=""></center>');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script>                        
 <div id="avatar">
                                                
 <center>
                         Carregando avatar...                        
 </center>
                                                
 </div>
                                                                                                                                                                                                                                                                              
 <div style="display: none;" class="g-2">
                                                                                                                                                                                                                                                                                            
 </div>
                                                                                                                                                                                                                                                                                      
 </div>
                                                                                                                                                                                                                                                                                    
 <div class="playername">
                                                                                                                                           Bem-vindo (a),<span id="link">{USERNAME}</span>                                                                                                                                        
 </div>
                                        
 </div>
                                  
 </div>
                                        
 </div>
</div>

Até mais!
Roevs

Roevs
Membro Entusiasta

Membro desde : 10/02/2012
Mensagens : 6484
Pontos : 8343

https://www.sololevelingrpg.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 26.06.19 13:49

Fiz alterações, porém, não resultou em nada.
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Roevs 26.06.19 17:54

Olá,

Você teria o código HTML do quadro de seu antigo fórum? Sem as modificações que você efetuou para o novo quadro?

Até mais!
Roevs

Roevs
Membro Entusiasta

Membro desde : 10/02/2012
Mensagens : 6484
Pontos : 8343

https://www.sololevelingrpg.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 26.06.19 18:02

Tenho sim, como pode ver no print lá funciona perfeitamente:

Widget de "Últimos Temas" no quadro de anúncios BV5xbF2

Link do forum: http://bloodofvalyria.forumeiros.com/

Códigos:


HTML

https://pastebin.com/eh89tYKq

JavaScript

Código:
/* globals jQuery */
 
(function($) {
    'use strict';
 
    $(function() {
        var $container = $('.welcomer2');
 
        if ($container.length === 0) {
            return;
        }
 
        var $marquee = $('#comments_scroll_div .marquee');
 
        if ($marquee.length === 0) {
            return;
        }
 
        var $parent = $container.closest('tr').find('div:last').parent();
 
        $parent
            .attr('id', 'comments-marquee')
            .html('')
            .css('overflow', 'hidden');
 
        $marquee = $marquee
            .marquee('destroy')
            .css('height', '255px')
            .css ('margin-left', '20px')
            .appendTo($parent)
            .marquee();
 
        $marquee.hover(function() {
            $marquee.marquee('pause');
        }, function() {
            $marquee.marquee('resume');
        });
    });
})(jQuery);
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Roevs 26.06.19 18:11

Olá,

Substitua o HTML por esse

Código:
<div align="center">
                                       
 <div id="quadro">
                                         
 <div class="box">
                                         
 <div id="ultposts">
                                       
 </div>
                                         
 <div class="awards">
                         
 <table>
    <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Melhor Post</a>       
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Melhor RP</a>   
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
    <a href="http://travelersrpg.forumeiros.com/">Melhor Trama</a>   
 </div>
       
 </div>
       
 </td>
       
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Melhor Shipp</a>   
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Heroi</a>       
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Vilão</a>       
 </div>
       
 </div>
       
 </td>
       
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>   
 </table>
         
 </div>
                                         
 <div class="clima">
                                     
 <div class="clima-texto">
                New York, 27º<br /><strong>Sol, Primavera</strong>               
 </div>
                               
 </div>
                                         
 <div class="links">
                                 
 <table>
            <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
                       
 <td>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                 
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 </td>
                       
 <td>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                     
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                 
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 </td>
                       
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>           
 </table>
                         
 </div>
                                                 
 <div class="staff">
                             
 <table>
        <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
               
 <td>
               
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
               
 <div class="stafficon">
      <a href="http://travelersrpg.forumeiros.com/">MP</a>       
 </div>
               
 </div>
               
 </td>
               
 <td>
               
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
               
 <div class="stafficon">
        <a href="http://travelersrpg.forumeiros.com/">MP</a>       
 </div>
               
 </div>
           
 </td>
               
 <td>
               
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
               
 <div class="stafficon">
      <a href="http://travelersrpg.forumeiros.com/">MP</a>       
 </div>
               
 </div>
           
 </td>
               
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>       
 </table>
                 
 </div>
                                         
 <div class="avatar">
                                       
 <div class="avaimg">
                                    <script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<center><img src="'+link+'" alt=""></center>');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script>                       
 <div id="avatar">
                                               
 <center>
                        Carregando avatar...                       
 </center>
                                               
 </div>
                                                                                                                                                                                                                                                                             
 <div style="display: none;" class="g-2">
                                                                                                                                                                                                                                                                                           
 </div>
                                                                                                                                                                                                                                                                                     
 </div>
                                                                                                                                                                                                                                                                                   
 <div class="playername">
                                                                                                                                          Bem-vindo (a),<span id="link">{USERNAME}</span>                                                                                                                                       
 </div>
                                       
 </div>
                                 
 </div>
                                       
 </div>
</div>

E o JS por esse

Código:
/* globals jQuery */
 
(function($) {
    'use strict';
 
    $(function() {
        var $container = $('#ultposts');
 
        if ($container.length === 0) {
            return;
        }
 
        var $marquee = $('#comments_scroll_div .marquee');
 
        if ($marquee.length === 0) {
            return;
        }
 
        var $parent = $container.closest('tr').find('div:last').parent();
 
        $parent
            .attr('id', 'comments-marquee')
            .html('')
            .css('overflow', 'hidden');
 
        $marquee = $marquee
            .marquee('destroy')
            .css('height', '255px')
            .css ('margin-left', '20px')
            .appendTo($parent)
            .marquee();
 
        $marquee.hover(function() {
            $marquee.marquee('pause');
        }, function() {
            $marquee.marquee('resume');
        });
    });
})(jQuery);

Até mais!
Roevs

Roevs
Membro Entusiasta

Membro desde : 10/02/2012
Mensagens : 6484
Pontos : 8343

https://www.sololevelingrpg.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 26.06.19 18:23

Fiz a alteração e o novo HTML desconfigurou todo o quadro:

Widget de "Últimos Temas" no quadro de anúncios XJ7LRnC
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Roevs 26.06.19 19:29

Olá,

Substitua o HTML por esse

Código:
<div align="center">
                                       
 <div id="quadro">
                                         
 <div class="box">
                                         
 <div class="posts">
                                   
 </div>
                                         
 <div class="awards">
                         
 <table>
    <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Melhor Post</a>       
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Melhor RP</a>   
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
    <a href="http://travelersrpg.forumeiros.com/">Melhor Trama</a>   
 </div>
       
 </div>
       
 </td>
       
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Melhor Shipp</a>   
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Heroi</a>       
 </div>
       
 </div>
       
 </td>
       
 <td>
       
 <div style="background: url('http://placehold.it/50x50')center; background-size: cover;" class="awardimg">
       
 <div class="awardicon">
      <a href="http://travelersrpg.forumeiros.com/">Vilão</a>       
 </div>
       
 </div>
       
 </td>
       
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>   
 </table>
         
 </div>
                                         
 <div class="clima">
                                     
 <div class="clima-texto">
                New York, 27º<br /><strong>Sol, Primavera</strong>               
 </div>
                               
 </div>
                                         
 <div class="links">
                                 
 <table>
            <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
                       
 <td>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                 
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 </td>
                       
 <td>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                     
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                       
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                 
 <div class="boxlink">
            <a href="http://travelersrpg.forumeiros.com/">Link</a>           
 </div>
                   
 </td>
                       
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>           
 </table>
                         
 </div>
                                                 
 <div class="staff">
                             
 <table>
        <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
 <tr style="">
               
 <td>
               
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
               
 <div class="stafficon">
      <a href="http://travelersrpg.forumeiros.com/">MP</a>       
 </div>
               
 </div>
               
 </td>
               
 <td>
               
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
               
 <div class="stafficon">
        <a href="http://travelersrpg.forumeiros.com/">MP</a>       
 </div>
               
 </div>
           
 </td>
               
 <td>
               
 <div class="staffimg" style="background: url('https://static.tvmaze.com/uploads/images/medium_portrait/177/443982.jpg')center; background-size: cover;">
               
 <div class="stafficon">
      <a href="http://travelersrpg.forumeiros.com/">MP</a>       
 </div>
               
 </div>
           
 </td>
               
 </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>       
 </table>
                 
 </div>
                                         
 <div class="avatar">
                                       
 <div class="avaimg">
                                    <script>
jQuery(document).ready(function(){
  jQuery.get('/profile?mode=editprofile&page_profil=avatars', function(data) {
      link = jQuery('.panel dl:first img', data).attr('src');
      if(link){
        jQuery('#avatar').html('<center><img src="'+link+'" alt=""></center>');
      }else{
        jQuery('#avatar').html('');
      }
  });
});
</script>                       
 <div id="avatar">
                                               
 <center>
                        Carregando avatar...                       
 </center>
                                               
 </div>
                                                                                                                                                                                                                                                                             
 <div style="display: none;" class="g-2">
                                                                                                                                                                                                                                                                                           
 </div>
                                                                                                                                                                                                                                                                                     
 </div>
                                                                                                                                                                                                                                                                                   
 <div class="playername">
                                                                                                                                          Bem-vindo (a),<span id="link">{USERNAME}</span>                                                                                                                                       
 </div>
                                       
 </div>
                                 
 </div>
                                       
 </div>
</div>

Depois substitua o seu JS por esse

Código:
(function($) {
  'use strict';
 
  $(function() {
    $('div#wrapper #left .module:first-child:first-child')
      .css('width', '100%')
      .appendTo('.posts')
    ;
  });
})(jQuery);

Até mais!
Roevs

Roevs
Membro Entusiasta

Membro desde : 10/02/2012
Mensagens : 6484
Pontos : 8343

https://www.sololevelingrpg.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 26.06.19 20:08

Estamos quase lá! O java funcionou bem, só preciso que no momento em que passe o mouse sobre os ultimos temas, eles parem de subir, ou seja, preciso de um "marquee".

É possível?
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Admineiro

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por tikky 27.06.19 8:17

Olá @Starset,
Starset escreveu:Estamos quase lá! O java funcionou bem, só preciso que no momento em que passe o mouse sobre os ultimos temas, eles parem de subir, ou seja, preciso de um "marquee".
mude o código para o seguinte:
Código:
(function($) {
  'use strict';
 
  $(function() {
    $('div#wrapper #left .module:first-child:first-child')
      .css('width', '100%')
      .appendTo('.posts')
    ;
   
    var $marquee = $('#comments_scroll_div .marquee');
 
        if ($marquee.length === 0) {
            return;
        }
   
        $marquee.hover(function() {
            $marquee
              .marquee('pause')
              ;
        }, function() {
            $marquee
              .marquee('resume')
              ;
        });
   
  });
})(jQuery);


Cordialmente,
pedxz.
tikky

tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Starset 27.06.19 11:13

Muito obrigado!

Funcionou perfeitamente! Pode fechar o tópico.

Resolvido
Starset

Starset
****

Membro desde : 02/03/2017
Mensagens : 265
Pontos : 378

http://neworleansoriginals.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Widget de "Últimos Temas" no quadro de anúncios

Mensagem por Roevs 27.06.19 11:44

Questão resolvida

Esta questão foi dada como resolvida pelo seu autor, e por esse motivo será marcada como resolvida e movida para o arquivo de questões resolvidas desta área.
Roevs

Roevs
Membro Entusiasta

Membro desde : 10/02/2012
Mensagens : 6484
Pontos : 8343

https://www.sololevelingrpg.com/

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos