Adição de setas e menu dropdown ao widget

4 participantes

Página 2 de 2 Anterior  1, 2

Ir para baixo

Tópico resolvido Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 13.04.17 18:41

Relembrando a primeira mensagem :

Detalhes da questão


Endereço do fórum: http://www.online-winxclub.com/
Versão do fórum: phpBB3

Descrição


Olá, muito boa tarde a todos! Muito feliz
Hoje estou aqui para vos pedir ajuda em dois widgets que eu tenho e pretendia mudá-los um pouco, acrescentando um sistema com uma espécie de menu dropdown e outro com duas setas e a possíbilidade de colocar variadas opções. Feliz

Vou explicar melhor com imagens, de modo a que seja mais fácil perceber, visto que eu sou um pouco confuso quanto aos pedidos. Rindo

Adição de setas e menu dropdown ao widget - Página 2 Games210

Então:
1. Este é o aspeto atual do widget. Na primeira caixa, em cima do local onde se encontra em letras maiúsculas "PLAY GAME" está uma barra cor-de-rosa que diz "WINX ADVENTURE", eu gostava que a mesma fosse removida (eu posso fazer isso, claro) e trocada por uma espécie de menu dropdown que se abre e te dá duas opções: Mini-games ou Winx Adventure.

Ficando mais ao menos assim:
Adição de setas e menu dropdown ao widget - Página 2 Games310

2. Na tabela de Classificações, gostaria que fosse possível acrescentar setas para mudarmos de mini-jogo para mini-jogo, sendo que a imagem com o 1, 2, 3,4, 5... (a tabela de classificações dos melhores jogadores) mudava inclusive. (Constatem a imagem acima).

3. Por fim, gostaria que fosse traduzivel para diversas linguas, já que o meu fórum tem diversos idiomas. Feliz

As imagens possivelmente necessárias:
Adição de setas e menu dropdown ao widget - Página 2 Btn_na10
Adição de setas e menu dropdown ao widget - Página 2 Btn_na11
Adição de setas e menu dropdown ao widget - Página 2 Highsc10
Adição de setas e menu dropdown ao widget - Página 2 Gamega10
Adição de setas e menu dropdown ao widget - Página 2 Gamega10
Adição de setas e menu dropdown ao widget - Página 2 Playga10

O código dos mesmos:

Código:
<div id="Menu_minigame_playButton">
</div>
 <script>
if(lang_=="en")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/XJqRN7E.png" border="0" style="" /></a>';
}
if(lang_=="pt")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/1a8O8Cn.png" border="0" style="" /></a>'
}
if(lang_=="fr")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/XwiEkQr.png" border="0" style="" /></a>'
}
if(lang_=="es")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/bmN14RA.png" border="0" style="" /></a>'
}
if(lang_=="ru")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/zneXvWO.png" border="0" style="" /></a>'
}
if(lang_=="pl")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/Z40sGUn.png" border="0" style="" /></a>'
}
if(lang_=="br")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/1a8O8Cn.png" border="0" style="" /></a>'
}
if(lang_=="tr")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="http://i.hizliresim.com/dbQAaL.png" border="0" style="" /></a>'
}
if(lang_=="it")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="https://i.imgur.com/GBKdrMA.png" border="0" style="" /></a>'
}
if(lang_=="de")
{
document.getElementById("Menu_minigame_playButton").innerHTML = '<a href="http://www.online-winxclub.com/portal?pid=38"><img src="http://i.hizliresim.com/r6qXGm.png" border="0" style="" /></a>'
}
</script>  <script>
document.getElementById("avatar").innerHTML = '<img src="'+_user_avatar+'" alt="" style="margin-top: -0px;">';
</script> 
<div style="background: url(http://i.hizliresim.com/Lyyplz.png) left no-repeat; height: 418px; width: 315px;">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            
   <div style="float: left; padding-left: 20px; padding-top: 39px;">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <strong><span style="color: #474747;"><span style="font-size: 14px;"><span id="highscoreText" style="font-family: Arial Black;">Rank</span></span></span></strong><br /><br /><br /><br /><br /><br />                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         
      <div style="float: left; padding-left: 45px;">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  
      </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           
   </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                
   <div align="center">
                                                                                                                                                                                                                                                                                                              <br /><br /><br /><br /><br /><br /><iframe style="width: 80%; height: 240px;" src="http://www.online-winxclub.com/h1-highscore" marginwidth="0" marginheight="0" scrolling="yes" frameborder="0"><div style="float: left; padding-left: 10px; padding-top: 0px;"></iframe>                                                                                                                                                                                                     
   </div>
                                                                                                                                                                                                         <script>
if(lang_=="en")
{
document.getElementById("highscoreText").innerText = 'Rank';
}
if(lang_=="pt")
{
document.getElementById("highscoreText").innerText = 'Classificação';
}
if(lang_=="fr")
{
document.getElementById("highscoreText").innerText = 'Classement';
}
if(lang_=="es")
{
document.getElementById("highscoreText").innerText = 'Puesto';
}
if(lang_=="ru")
{
document.getElementById("highscoreText").innerText = 'Рекорд';
}
if(lang_=="pl")
{
document.getElementById("highscoreText").innerText = 'Wysoki wynik';
}
if(lang_=="br")
{
document.getElementById("highscoreText").innerText = 'Classificação';
}
if(lang_=="tr")
{
document.getElementById("highscoreText").innerText = 'Yüksek skor';
}
if(lang_=="it")
{
document.getElementById("highscoreText").innerText = 'Classifica';
}
if(lang_=="de")
{
document.getElementById("highscoreText").innerText = 'Highscore';
}
</script>             

                                               
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo


Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 25.05.17 18:09

Quase lá. Rindo
Aqui está o que falta, se não for muito complicado!
- Eu gostaria que depois do 5, existisse uma barra que fosse para baixo (como você fez originalmente quando estava mais largo Feliz )

Gostaria que esta zona diminuisse um pouco, ficando assim:
Adição de setas e menu dropdown ao widget - Página 2 Adoro10

E já agora, o menu que aí está não é suposto ter o mesmo texto que o debaixo kkk
Os menus são os mesmos, o de cima e o de baixo.
Porém aqui, onde está esse avatar, é suposto dizer apenas "Mini-jogos" e "Winx Adventure", sendo que o de baixo, com a tabela de ranking é que diz "Kikos Adventure", etc...

Gostaria por último que fosse possível editar a fonte e o tamanho para cada texto presente. >-<

Obrigado por tudo Feliz


PS - O novo JS foi desativado porque bugou o sistema de idiomas e a caixa de usuários no site Feliz
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 27.05.17 16:13

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 28.05.17 18:08

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 29.05.17 22:24

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por Kyo Panda 30.05.17 19:28

https://codepen.io/anon/pen/BRgvrm?editors=0100

Eu separei as opções dos menus superior e inferior e adicionei o scroll. As fontes podem ser configuradas dentro do .fa-winxgames (o senhor precisa de apoio quanto aos estilos CSS?). Já o bug, precisaria ver o que está acontecendo.
Kyo Panda
Kyo Panda
Hiper Membro

Membro desde : 08/01/2012
Mensagens : 4641
Pontos : 5939

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 30.05.17 23:51

Reativei o JS agora. Feliz
Relembro que o erro que ocorre devido ao JS é: A opção sair na caixa do usuário e o sistema de idiomas desapareceram.

Talvez seja melhor eu ter ajuda mesmo no CSS, pois não estou conseguindo colocar as fontes (me sinto censurado agora, mas CSS não é bem o meu forte) kkk
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 01.06.17 20:36

Kyo, o site está um pouco bugado devido ao código então penso que terei de colocar o JS que me deu desativado novamente...

Se quer saber o que se passa, na página inicial e apenas na página inicial o sistema de idiomas desaparece, bem como o botão sair, compare:

com o JS ativo
Adição de setas e menu dropdown ao widget - Página 2 Bug10

com o JS desativado
Adição de setas e menu dropdown ao widget - Página 2 Amo_lo10
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 04.06.17 10:07

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 06.06.17 20:33

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 10.06.17 9:24

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 14.06.17 20:00

up
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por Luiz 15.06.17 21:24

Apenas para facilitar o suporte que está obtendo pelo nosso amigo @Kyo Panda:

Para que ele possa realmente saber o que se passa, infelizmente, o senhor terá que manter o Javascript ativado, dado que é usando as ferramentas do desenvolvedor que conseguimos procurar o problema. E caso o código não estiver ativo, como nós vamos conseguir procurá-lo?

o/

Luiz
Luiz
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 17.06.17 4:44

Daqui a 2 dias irei colocar sem falta Muito feliz
Neste momento estou em casa de um amigo meu e passarei o fim de semana cá, não posso mesmo que queira :s
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 19.06.17 10:09

Já adicionei tudo! Feliz
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por juleic1123 22.06.17 21:47

up....
juleic1123
juleic1123
Membro

Membro desde : 04/05/2011
Mensagens : 670
Pontos : 934

http://www.online-winxclub.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Adição de setas e menu dropdown ao widget

Mensagem por Luiz 26.06.17 16:56

Dado que questões sobre JS são consideradas abandonadas após três dias sem atividade no tópico:

Questão abandonada pelo autor, mas considerada resolvida por ter solução para o problema.
Tópico marcado como Resolvido e movido para Questões resolvidas.
Luiz
Luiz
Membro Entusiasta

Membro desde : 23/04/2016
Mensagens : 6645
Pontos : 7451

https://luizfelipe.dev

Ir para o topo Ir para baixo

Página 2 de 2 Anterior  1, 2

Ir para o topo

- Tópicos semelhantes

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