Inserir Calculadora Javascript dentro de um Template

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

Resolvido Inserir Calculadora Javascript dentro de um Template

Mensagem por zHugh em 27/01/18, 12:23 pm

Detalhes da questão


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

Descrição


Olá, recentemente tenho tendado criar alguns JS para auxilar o processo de jogabilidade do meu fórum, no entanto como ainda estou iniciando nisto, é evidente que possa haver uma série de problemas.

O fato é que, o código em questão http://pokemonillium.forumeiros.com/h8-dados-de-20-faces-numero-aleatorio, assim como outros dois que desenvolvi, estes funcionam normalmente quando hospedados em uma nova página HTML, esteja ela usando os recursos do fórum ou não. No entanto, eu gostaria de colocadas dentro de um tooltip, que esta no canto superior esquerdo do meu fórum, de modo que ao clicar sobre o botão, abriria o Tooltip com esta calculadora dentro.

Porém, diversas tentativas foram feitas mas o mesmo tende a não funcionar quando alocado naquela região.

No caso, eu gostaria de colocar o código da calculadora dentro deste modal, especificamente nos locais que onde está escrito "A preencher".

Código:
<div class="tablon-anuncios">
                                                                                             
                <div id="dmg-tab" class="modal-content">
                                                                                                           
                        <table cellspacing="0"><tbody><tr><td>
<div class="ambientacion"><div align="justify" style="font-family: roboto; color: #3d72bd; background: white; padding: 10px; text-transform: uppercase; border-radius: 5px; opacity: 0.8; font-size: 10px;">A tabela a seguir disponibiliza o valor que cada movimento causa conforme seu POWER. Para saber mais sobre o conteúdo, acesse e leia <a href="http://pokemonillium.forumeiros.com/t19-base-de-dano-dos-movimentos"><strong>Dano base dos movimentos</strong></a></div>                          <center>
<img src="https://images2.imgbox.com/43/17/RClX18fs_o.png" />                             
                                                        </div>
                                                                                                                               
                                                </td>                                                                         
                                        </tr>
                                                                                                               
                                </tbody>
                                                                                                       
                        </table>
                                                                                                   
                </div>
                                                                                             
                <div id="st-tab" class="modal-content">
                                                                               
      A Preencher
                                                                                                 
                </div>
                                                                               
                <div id="status-tab" class="modal-content">
                                                                                             
                A Preencher
                                                                                               
                </div>
                                                                               
                <div id="weather-tab" class="modal-content"><div align="justify" style="font-family: roboto; color: #3d72bd; background: white; padding: 10px; text-transform: uppercase; border-radius: 5px; opacity: 0.8; font-size: 10px;">Conheça os principais climas e seus efeitos mais relevantes em combate. Para saber todos os efeitos das condições climáticas, acesse e leia <a href="http://pokemonillium.forumeiros.com/t10-estacoes-e-meteorologia"><strong>Estações e Meteorologia</strong></a></div>                          <center>
<br><img src="https://images2.imgbox.com/19/53/qjORNRd5_o.png" />                               
                                                                                     
                </div>
                             
        </div>

Creio que o não funcionamento do código seja a alocação dos códigos CSS e JS, entretanto mesmo usando a alocação externa destes, eu não consigo fazer com que a calculadora funcione atenda aos comandos do JS, tão pouco receba a customização do CSS.
avatar

zHugh
Usuário destaque

Masculino
Inscrito dia : 30/03/2010
Mensagens : 712
Pontos Ativos : 1152

Ver perfil do usuário http://superonzerpg.forumeiros.net/

Resolvido Re: Inserir Calculadora Javascript dentro de um Template

Mensagem por zHugh em 28/01/18, 01:11 pm

UPzinho
avatar

zHugh
Usuário destaque

Masculino
Inscrito dia : 30/03/2010
Mensagens : 712
Pontos Ativos : 1152

Ver perfil do usuário http://superonzerpg.forumeiros.net/

Resolvido Re: Inserir Calculadora Javascript dentro de um Template

Mensagem por virus em 29/01/18, 01:41 pm

Não tenho muita certeza do que está acontecendo, mas eu testei em meu fórum e funciona normalmente.
Tenta desativa os javascripts (que pode está atrapalhando talvez) e use esse código test que tem apenas uma calculadora.



Código:
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script src='https://codebe0.neocities.org/paginaforum/assets/forumeiros/script.js'></script>
<link rel="stylesheet" src="https://codebe0.neocities.org/paginaforum/assets/forumeiros/style.css">
<meta charset="utf-8">
<form id="dadosintefaces">
      <div id="tabledados">
      <span>Dados de vinte faces</span>


<table class="tablerandnum0">   
   <tr>
      <td><label for="brutnum">D20</label></td>
     <td><label for="porcenum">%</label></td>
   </tr>
   <tr>
      <td><input style="border-radius: 10px;width: 100%; height: 50px;" class='brutnum' type="text" name="brutnum" disabled="disabled"/></td>
      <td><input style="border-radius: 10px; width: 100%; height: 50px;"  class='porcenum' type="text" name="porcenum" disabled="disabled"/></td>
    </tr>
</table>
    <br>
   
      <input type="button" value="Calcular"  class="calc">
      <input type="reset" value="Reiniciar"/>

   </div>

</form>
Obs; São arquivos externos logo vou excluir da minha host.
avatar

virus
Usuário destaque

Masculino
Inscrito dia : 03/03/2013
Mensagens : 697
Pontos Ativos : 908

Ver perfil do usuário

Resolvido Re: Inserir Calculadora Javascript dentro de um Template

Mensagem por MateusAnjosV em 01/02/18, 10:42 am

Vamos lá, vou tratá-lo como programador, ok?
Na teoria, você está executando o javascript ANTES da div existir, em outras palavras, varia de internet pra internet e bla bla bla...
Põe teu JS dentro da .load
Seta http://api.jquery.com/load/

E talvez sane o problema.

Edit1:
Ex.:
Código:
$(window).load(function() {
// CÓDIGO
});
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1645
Pontos Ativos : 2259

Ver perfil do usuário http://holder.forumeiros.com/

Resolvido Re: Inserir Calculadora Javascript dentro de um Template

Mensagem por Luiz em 17/02/18, 11:05 pm

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

Luiz
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 22/04/2016
Mensagens : 6569
Pontos Ativos : 7336

Ver perfil do usuário https://github.com/lffg/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum