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

Abrir Janela Sem Deformar A Pagina

João Francisco ... s0adex

Perguntado por João Francisco ... s0adex,

 Share

Pergunta

João Francisco ... s0adex

João Francisco ... s0adex

Postado
Postado (editado)

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
fahledu

fahledu

Postado
Postado

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.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

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