Pessoal, sou meio newbie na área, e tô voltando com um projeto antigo que foi desenvolvido por alguns amigos junto a mim. O projeto, resumindo, é um simulador de habilidades. Na página principal temos quatro botões onde, um aumenta o nível da habilidade para o máximo, o outro aumenta de um em um, e os outros dois tem essa mesma função só que diminuindo. O problema começa aí... tínhamos criado uma ferramenta (acho que é tooltip que chama), onde você passaria o mouse em cima dos três últimos botões, e abriria uma caixinha flutuante mostrando a descrição da habilidade (nível, mana necessária, resfriamento e afins), só que ao chegar no botão que fica no parte direita, a caixa não se adapta e vira o lado para que a descrição possa ser mostrada, ao invés disso, ela entra atrás da barra de rolagem e fica cortada, isso também acontece no final da página, quando a caixinha mostra duas descrições da habilidade. Gostaria de saber se há algum modo de tornar a ferramenta adaptativa, para quando chegar nesses "extremos" da página, a caixa mudar o lado para que o usuário possa ver o que está escrito. Basicamente, todo o código dela dentro do html/css é este: ``` #hintbox{ opacity: 0.95; display: none; position: fixed; height: 450px; width: 250px; font-size: 10 px; background-color: #161616; color: #fff; padding: 8px; border-radius:9px; text-align: left; word-wrap: break-word; font-family:Verdana; } $(document).ready(function () { $('.downArrow,.upArrow,.dupArrow').mousemove(function (e) { if (popUPCheck($(this).attr('nmbr'), $(this).attr('class'))) $('#hintbox').html(popUP($(this).attr('nmbr'), $(this).attr('class'))).show(); $('#hintbox').css('top', e.clientY + 15).css('left', e.clientX + 15); }) .mouseout(function () { $('#hintbox').hide(); }); }); Também tem uma parte em javascript function popUP(lvl, arrow) { var CDHere = CDValue; if(lvl == 16 && chosenClass == "Warrior"){ CDHere = 1; } var lastCheck = maxPoints[lvl] - 1; if(lastCheck<0){ lastCheck = 0; } var name = "

" + skillDescription[lvl] + "

"; var currentLevel = "

[Nível atual]

Nível necessário : " + skillLevel[lvl][skillPoint[lvl] - 1]; var nextLevel = "

[Próximo nível]

Nível necessário : " + skillLevel[lvl][skillPoint[lvl]]; var skilldesc = "

" + skillInfo[lvl][skillPoint[lvl] - 1] + "

"; var mpcurrent = "Mana necessária : " + mp[lvl][skillPoint[lvl] - 1]; var cdcurrent = "Resfriamento : " + (CDHere * cd[lvl][skillPoint[lvl] - 1]).toFixed(0) + " sec"; var castingcurrent = "Tempo de lançamento : " + cast[lvl][skillPoint[lvl] - 1] + " sec"; var skilldescnext = "

" + skillInfo[lvl][skillPoint[lvl]] + "

"; var mpnext = "Mana necessária : " + mp[lvl][skillPoint[lvl]]; var cdnext = "Resfriamento : " + (CDHere * cd[lvl][skillPoint[lvl]]).toFixed(0) + " sec"; var castingnext = "Tempo de lançamento : " + cast[lvl][skillPoint[lvl]] + " sec"; var previousLevel = "

[Nível anterior]

Nível necessário : " + skillLevel[lvl][skillPoint[lvl] - 2] var skilldescPrev = "

" + skillInfo[lvl][skillPoint[lvl] - 2] + "

"; var mpPrev = "Mana necessária : " + mp[lvl][skillPoint[lvl] - 2]; var cdPrev = "Resfriamento : " + (CDHere * cd[lvl][skillPoint[lvl] - 2]).toFixed(0) + " sec"; var castingPrev = "Tempo de lançamento : " + cast[lvl][skillPoint[lvl] - 2] + " sec"; var lastLevel = "

[Próximo Nível]

Nível necessário : " + skillLevel[lvl][lastCheck]; var skilldescLast = "

" + skillInfo[lvl][lastCheck] + "

"; var mpLast = "Mana necessária : " + mp[lvl][lastCheck]; var cdLast = "Resfriamento : " + (CDHere * cd[lvl][lastCheck]).toFixed(0) + " sec"; var castingLast = "Tempo de lançamento : " + cast[lvl][lastCheck] + " sec"; if (lvl == 8 || lvl == 9 || lvl == 19 || lvl == 22) { var allNextLevel = nextLevel + "

Passiva

" + skilldescnext; var allCurrentLevel = currentLevel + "

Passiva

" + skilldesc + "
"; var allPreviousLevel = previousLevel + "

Passiva

" + skilldescPrev + "
"; var allLastLevel = lastLevel + "

Passiva

" + skilldescLast + "
"; } else if (cast[lvl][skillPoint[0]] == 0 ||!cast[lvl][skillPoint[0]] ) { var allCurrentLevel = currentLevel + "
" + mpcurrent + "
" + cdcurrent + "
" + skilldesc + "
"; var allNextLevel = nextLevel + "
" + mpnext + "
" + cdnext + "
" + skilldescnext; var allPreviousLevel = previousLevel + "
" + mpPrev + "
" + cdPrev + "
" + skilldescPrev; var allLastLevel = lastLevel + "
" + mpLast + "
" + cdLast + "
" + skilldescLast; } else { var allCurrentLevel = currentLevel + "
" + mpcurrent + "
" + cdcurrent + "
" + castingcurrent + "
" + skilldesc + "
"; var allNextLevel = nextLevel + "
" + mpnext + "
" + cdnext + "
" + castingnext + "
" + skilldescnext; var allPreviousLevel = previousLevel + "
" + mpPrev + "
" + cdPrev + "
" + castingPrev + "
" + skilldescPrev; var allLastLevel = lastLevel + "
" + mpLast + "
" + cdLast + "
" + castingLast + "
" + skilldescLast; } Alguém consegue dar um help? Segue também duas screenshots mostrando, uma no final da página, e a outra ao lado direito da página. /applications/core/interface/imageproxy/imageproxy.php?img=https://i.imgur.com/XoLG7jj.png&key=4471ebef53af5d00b137250a0f0dbfa647b0b65f97e3be898bfda7481d81f769" width="318" data-imageproxy-source="https://i.imgur.com/XoLG7jj.png" /> /applications/core/interface/imageproxy/imageproxy.php?img=https://i.imgur.com/LGonlC5.png&key=e3fb5c1fbda80320dba033921337ed89a651140f2c16198606eaa6fe8dd7d19d" width="281" data-imageproxy-source="https://i.imgur.com/LGonlC5.png" /> ```

Donghaki

Problema com limite da página