Ir para conteúdo
Fórum Script Brasil
  • 0

Abrir Janela Sem Deformar A Pagina


João Francisco ... s0adex

Pergunta

Aeee pessoal ... Sou novo por aqui e já venho pedir ajuda... Aliais, me cadastrei aqui agora isso mesmo...

Ok, vamos ao que interessa. (demorou)

Estou com um problema. (óbvio)

Bem, estou desenvolvendo um site. E nesse site, há textos grandes, que no caso deformariam-no.

Então , pediram para eu fazer um JavaScript, para abrir uma janelinha ( Não POP UP ) que aparecesse o texto sem deformar a página, fiquei tempo procurando um Script pronto, pois não sei nada de JavaScript.

Então, depois de muitas horas, achei o dito cujo Script.

Perfeito para o que precisava. ( Foi nesse próprio site )

Só que há um porém. O site, ele é muito extenso, então o que acontece é que, se há a uma ação do JavaScript após de você descer um pouco , não funciona, pois a janelinha abre somente no topo do site. Então pensei fazer algo que fizesse a Janelinha ( layer ) seguir o mouse, ou algo do tipo. Alguém sabe fazer isto ?

Aqui está o Link

https://www.scriptbrasil.com.br/script/java...ado_em_link.zip

Obrigado desde já para o pessoal do ScriptBrasil !

Editado por João Francisco ... s0adex
Link para o comentário
Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

  • 0

Um ex.

<html>
<body>



<head>
<style TYPE="text/css">
#floater {
      position: absolute;
      right: 0;
      visibility: visible;
      z-index: 0;
}
</style>
</head>
<script LANGUAGE="JavaScript">

      self.onError=null;
      currentX = currentY = 0;  
      whichIt = null;          
      lastScrollX = 0; lastScrollY = 0;
      NS = (document.layers) ? 1 : 0;
      IE = (document.all) ? 1: 0;



      function heartBeat() {

          if(IE) { diffY = document.body.scrollTop; diffX = document.body.scrollLeft; }
          if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; }
          if(diffY != lastScrollY) {
                      percent = .1 * (diffY - lastScrollY);
                      if(percent > 0) percent = Math.ceil(percent);
                      else percent = Math.floor(percent);
                                      if(IE) document.all.floater.style.pixelTop += percent;
                                      if(NS) document.floater.top += percent; 
                      lastScrollY = lastScrollY + percent;
          }
              if(diffX != lastScrollX) {
                      percent = .1 * (diffX - lastScrollX);
                      if(percent > 0) percent = Math.ceil(percent);
                      else percent = Math.floor(percent);
                      if(IE) document.all.floater.style.pixelLeft += percent;
                      if(NS) document.floater.left += percent;
                      lastScrollX = lastScrollX + percent;
              }      
      }



      function checkFocus(x,y) { 

              stalkerx = document.floater.pageX;
              stalkery = document.floater.pageY;
              stalkerwidth = document.floater.clip.width;
              stalkerheight = document.floater.clip.height;
              if( (x > stalkerx && x < (stalkerx+stalkerwidth)) && (y > stalkery && y < (stalkery+stalkerheight))) return true;
              else return false;
      }
  
      function grabIt(e) {

              if(IE) {
                      whichIt = event.srcElement;
                      while (whichIt.id.indexOf("floater") == -1) {
                              whichIt = whichIt.parentElement;
                              if (whichIt == null) { return true; }
                  }
                      whichIt.style.pixelLeft = whichIt.offsetLeft;
                  whichIt.style.pixelTop = whichIt.offsetTop;
                      currentX = (event.clientX + document.body.scrollLeft);
                      currentY = (event.clientY + document.body.scrollTop);  
              } else { 
              window.captureEvents(Event.MOUSEMOVE);
              if(checkFocus (e.pageX,e.pageY)) { 
                      whichIt = document.floater;
                      StalkerTouchedX = e.pageX-document.floater.pageX;
                      StalkerTouchedY = e.pageY-document.floater.pageY;
              } 
              }
          return true;
      }
      
      function moveIt(e) {
              if (whichIt == null) { return false; }
              if(IE) {
                  newX = (event.clientX + document.body.scrollLeft);
                  newY = (event.clientY + document.body.scrollTop);
                  distanceX = (newX - currentX);    distanceY = (newY - currentY);
                  currentX = newX;    currentY = newY;
                  whichIt.style.pixelLeft += distanceX;
                  whichIt.style.pixelTop += distanceY;
                      if(whichIt.style.pixelTop < document.body.scrollTop) whichIt.style.pixelTop = document.body.scrollTop;
                      if(whichIt.style.pixelLeft < document.body.scrollLeft) whichIt.style.pixelLeft = document.body.scrollLeft;
                      if(whichIt.style.pixelLeft > document.body.offsetWidth - document.body.scrollLeft - whichIt.style.pixelWidth - 20) whichIt.style.pixelLeft = document.body.offsetWidth - whichIt.style.pixelWidth - 20;
                      if(whichIt.style.pixelTop > document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 5) whichIt.style.pixelTop = document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 5;
                      event.returnValue = false;
              } else { 
                      whichIt.moveTo(e.pageX-StalkerTouchedX,e.pageY-StalkerTouchedY);
              if(whichIt.left < 0+self.pageXOffset) whichIt.left = 0+self.pageXOffset;
              if(whichIt.top < 0+self.pageYOffset) whichIt.top = 0+self.pageYOffset;
              if( (whichIt.left + whichIt.clip.width) >= (window.innerWidth+self.pageXOffset-17)) whichIt.left = ((window.innerWidth+self.pageXOffset)-whichIt.clip.width)-17;
              if( (whichIt.top + whichIt.clip.height) >= (window.innerHeight+self.pageYOffset-17)) whichIt.top = ((window.innerHeight+self.pageYOffset)-whichIt.clip.height)-17;
              return false;
              }
          return false;
      }
      
      function dropIt() {
              whichIt = null;
          if(NS) window.releaseEvents (Event.MOUSEMOVE);
          return true;
      }

      
      if(NS) {
              window.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN);
              window.onmousedown = grabIt;
              window.onmousemove = moveIt;
              window.onmouseup = dropIt;
      }
      if(IE) {
              document.onmousedown = grabIt;
              document.onmousemove = moveIt;
              document.onmouseup = dropIt;
      }
      
      if(NS || IE) action = window.setInterval("heartBeat()",1);

</script>

<div id="floater" style="position:absolute; left:400px; top:10px">
<input type="submit"</p>
<div align="center"><center>

<!------------------------------------------------------->
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>
<font size=5 color=white>PARA TESTAR O EFEITO </FONT>

</body>
</html>

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,4k
×
×
  • Criar Novo...