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

Personalizar Botão Direito

Guest Kaka

Perguntado por Guest Kaka,

 Share

Pergunta

Guest Kaka

Guest Kaka

Postado
Postado

Tudo bem pessoal ???

Venho aqui levantar uma questão para os mais entendidos.

Gostaria de personalizar o clique do botão direito do mouse como acontece em alguns softwares.

Nem é necessário colocar imagens nem nada, apenas deixar 2 itens: copiar e colar.

Alguém sabe se isso é possível ???

Obrigado.

Link para o comentário
Compartilhar em outros sites

46 respostass a esta questão

Posts Recomendados

  • 0
Kaka

Kaka

Postado
Postado

Funcionou Crystian !!! Ele tá exibindo o nome certinho.

Agora não sei como passar o focus para o text "obj.name";

Veja se você pode me ajudar:

<script type="text/javascript">

function clickMouse(evt){
var obj = evt.srcElement;
alert(""+obj.name+"");

}


function exec(c,i,v){

obj.name.focus(); // [COLOR=red][B]nesta linha eu tenho que setar o focus no campo clicado ![/B][/COLOR]

var sel = document.selection.createRange();

document.execCommand(c, i, v);

obj.name.focus(); // [COLOR=red][B]nesta linha eu tenho que setar o focus no campo clicado ![/B][/COLOR]

}

</script>

Coloquei os comentários acima. Aquele obj.name.focus(); não funciona, eu não sei a sintaxe que deve ser usada.

Mais uma vez obrigado.

Link para o comentário
Compartilhar em outros sites
  • 0
Kaka

Kaka

Postado
Postado

Ahhh to ficando desanimado ... rs ... wink.gif

olha o erro que dá: Erro: 'obj' não está definido.

Você não utiliza IE né ? Vou mandar a página exatamente como ela tá, com o script que o Fabyo fez (clique com botão direito). O erro é exatamente o citado acima.

<html>
<head>
<title>Botao direito</title>

<head>

<style type="text/css">
<!--
  body, td {font: 80% verdana}
  #menu {background-color: menu; border-width: 2px; border-style: outset;
        visibility: hidden; position: absolute; top: 10px; left: 10px}  
  #links td {cursor: default; text-indent: 1em}
//-->
</style>


<script type="text/javascript">

function clickMouse(evt){
var obj = evt.srcElement;
alert(""+obj.name+"");

}


function exec(c,i,v){

obj.focus(); 

var sel = document.selection.createRange();

document.execCommand(c, i, v);

obj.focus(); 

}

</script>


</head>

<body>

<div id="menu">
<table id="links">

  <tr>
    <td title="Recortar (Ctrl+X)" onclick='exec("Cut");' onmouseover="cor1(this)" 
    onmouseout="cor2(this)">Recortar</td>  </tr>

  <tr>
    <td title="Copiar (Ctrl+C)" onclick='exec("Copy");' onmouseover="cor1(this)" 
    onmouseout="cor2(this)">Copiar</td>  </tr>
  
<tr><td title="Colar (Ctrl+V)" onclick='exec("Paste");' onmouseover="cor1(this)" 
    onmouseout="cor2(this)">Colar</td>  </tr>

</table>
</div>

<script type="text/javascript">
<!--


  function mostrar(){
    window.event.returnValue = false; 
    menu.style.visibility = 'visible';
    menu.style.top = window.event.clientY;
    menu.style.left = window.event.clientX;    
  }
  
  function ocultar(){
    if(window.event.srcElement.tagName == "BODY"){ 
      menu.style.visibility = 'hidden';
    }  
  }
  
  function cor1(obj){
    obj.style.backgroundColor = 'highlight';
    obj.style.color = 'white';
  }
  
  function cor2(obj){
    obj.style.backgroundColor = 'menu';
    obj.style.color = 'black';
  }
  
  document.oncontextmenu = mostrar;
  document.onclick = ocultar; 
//-->
</script>


Please note that users of Microsoft Windows XP with <b>Service Pack 2</b> will need to unblock 

this page in order to see the menu. 
The reason for this is due to the fact that the menu has been written in JavaScript. 
This feature is considered unsafe when used locally and Service Pack 2 now blocks this by default 

for your safety. 
This only happens when you run the menu on a local machine, live use on the Internet will not be 

affected. 

<br>
<br>

<input type="text" name="teste" onclick="clickMouse(event);">

</body>
</html>

Tá difiiiicil, mas não vou desistir ...hehe

Abraço cara.

Link para o comentário
Compartilhar em outros sites
  • 0
Kaka

Kaka

Postado
Postado

Aeee Crystian !!! Não é que funcionou cara ??

Essa foi boa, tá colando certinho !!!

Agora copiando algum texto da própria página não tá, porque a função seta o focus, "copia ou cola" o texto no objeto setado.

Sabendo disso, qual seria a melhor maneira para copiar um texto da página ? Colocando um onload na página ??

Abraço cara.

Link para o comentário
Compartilhar em outros sites
  • 0
Kaka

Kaka

Postado
Postado

Exatamente Crystian, só funciona para objetos de formulário.

Ele não emite erro nenhum, apenas não copia o texto selecionado.

Já tentei fazer uma gambiarra de colocar um div do começo ao fim da página, ele identifica o nome do div tudo certinho, mas não tem a propriedade de setar focus né, então ele não executa a função.

Será que tem alguma outra solução ??

Abraços

Link para o comentário
Compartilhar em outros sites
  • 0
Illidan

Illidan

Postado
Postado

Pessoal... gostei desse código de vocês. Tava dando uma mexida nele, mas ainda não consegui arrumar os problemas pra "copiar" e "recortar" textos do corpo da página. Só achei estranho que, quando eu copio um recorto um conteúdo do campo "text", ele funciona perfeitamente! Não entendi... hehehe

Bom, eu simplifiquei um pouco o código e acrescentei efeitos de Fade In e Fade Out... ficou bem legal. Se vocês quieserem dar uma olhada... rolleyes.gif

Abraços

<html>

<head>

<title>Botao direito</title>

<head>

<style type="text/css">

<!--

body  { font: 80% verdana; }

#menu {

    display: none;

    position: absolute;

    top: 10px;

    left: 10px;

    width: 100px;

    cursor: default;

    padding: 5px 2px;

    font-size: 11px;

    background-color: menu;

    border: 2px outset ;

}

#menu a {

    display: block;

    width: 100%;

    cursor: default;

    padding: 1px 5px;

    text-decoration: none;

    color: #000000;

}

#menu a:hover {

    background-color: highlight;

    color: #ffffff;

}

-->

</style>

<script type="text/javascript">

var obj;

function clickMouse(evt) {

    if (evt.srcElement) {

        if (evt.srcElement.type == "text") {

            obj = evt.srcElement;

        }

    }

}

function exec(c, i, v) {

    obj.focus();

    var sel = document.selection.createRange();

    document.execCommand(c, i, v);

    ocultar();

}

function mostrar() {

    if (document.all) {

        coordX = event.clientX;

        coordY = event.clientY;

        event.returnValue = false;

    } else {

        coordX = e.pageX;

        coordY = e.pageY;

        event.returnValue = false; // Arrumar aqui para Mozilla, Opera

    }

    menu.style.display = "block";

    fadeIn();

    menu.style.top  = coordY;

    menu.style.left = coordX;

}

function fadeIn(a) {

    if (a == null) { a = 0; }

    menu.style.filter = "alpha(opacity=" + a + ")";

    if (a < 100) {

        setTimeout("fadeIn(" + (a+10) + ")", 30);

    } else {

        menu.style.filter = "";

    }

}

function ocultar(a) {

    // cria um fade out

    if (a == null) { a = 100; }

    menu.style.filter = "alpha(opacity=" + a + ")";

    if (a > 0) {

        setTimeout("ocultar(" + (a-10) + ")", 20);

    } else {

        menu.style.display = "";

    }

}

document.oncontextmenu = mostrar;

document.onclick = ocultar;

</script>

</head>

<body>

<pre>

  Please note that users of Microsoft Windows XP with <b>Service Pack 2</b> will need to unblock this page in order to see the menu.

  The reason for this is due to the fact that the menu has been written in JavaScript.

  This feature is considered unsafe when used locally and Service Pack 2 now blocks this by default for your safety.

  This only happens when you run the menu on a local machine, live use on the Internet will not be affected.

  <input type="text" name="teste" onclick="clickMouse(event);" />

</pre>

<div id="menu">

  <a href="javascript:;" onclick="exec('Copy');"  title="Copiar (Ctrl+C)">Copiar</a>

  <a href="javascript:;" onclick="exec('Cut');"   title="Recortar (Ctrl+X)">Recortar</a>

  <a href="javascript:;" onclick="exec('Paste');" title="Colar (Ctrl+V)">Colar</a>

</div>

</body>

</html>

Link para o comentário
Compartilhar em outros sites
  • 0
rEd nEcK *

rEd nEcK *

Postado
Postado

Gente descobri o erro !

tipo... o script ta perfeito em? parabens a todos que trabalharam nele...

mais aqui esta o erro:

function exec(c, i, v) {

    obj.focus();

    var sel = document.selection.createRange();

    document.execCommand(c, i, v);

    ocultar();

}

tipo, primeiro que não esta copiando porque voces estao dando focus no campo, antes de copiar o que esta selecionado !

ae vai uma dica então:

function exec(c, i, v) {

    var sel = document.selection.createRange();

    document.execCommand(c, i, v);

    ocultar();

}

aqui em casa funfou !

testem ae ! =]

byebye e belissimo trabalho em equipe de voces =]

Link para o comentário
Compartilhar em outros sites
  • 0
Illidan

Illidan

Postado
Postado

E eu sem o IE não posso testar nada. Daria pra tentar fazer um script q copiasse e colasse no Mozilla não é???? Alguém tah afim de fazer?

Pode contar comigo. Vamos tentar criar um para o Mozilla e Opera smile.gif

Red Neck, aqui só funcionou o "copiar" e "colar"... com o "recortar", ele apaga a parte selecionada do texto e não cola depois! sad.gif

Abraços!

Link para o comentário
Compartilhar em outros sites
  • 0
Kaka

Kaka

Postado
Postado

Fala pessoal !!!

O script que foi mandado estava apenas copiando, mas não colava.

Chamando uma outra função, consegui fazer colar dentro do input selecionado.

Façam um teste e me avisem ... Abraços

<html>
<head>
<title>Botao direito</title>

<head>

<style type="text/css">
<!--
body  { font: 80% verdana; }
#menu {
    display: none;
    position: absolute;
    top: 10px;
    left: 10px;
    width: 100px;
    cursor: default;
    padding: 5px 2px;
    font-size: 11px;
    background-color: menu;
    border: 2px outset;
}
#menu a {
    display: block;
    width: 100%;
    cursor: default;
    padding: 1px 5px;
    text-decoration: none;
    color: #000000;
}
#menu a:hover {
    background-color: highlight;
    color: #ffffff;
}
-->
</style>


<script type="text/javascript">

var obj;

function clickMouse(evt) {
    if (evt.srcElement) {
        if (evt.srcElement.type == "text") {
            obj = evt.srcElement;
        }
    }
}


function exec(c, i, v) {
    var sel = document.selection.createRange();
    document.execCommand(c, i, v);
    ocultar();
}

function exec2(c, i, v) {
    obj.focus();
    var sel = document.selection.createRange();
    document.execCommand(c, i, v);
    obj.focus();
    ocultar();
}

function mostrar() {
    if (document.all) {
        coordX = event.clientX;
        coordY = event.clientY;
        event.returnValue = false;
    } else {
        coordX = e.pageX;
        coordY = e.pageY;
        event.returnValue = false; // Arrumar aqui para Mozilla, Opera
    }

    menu.style.display = "block";
    fadeIn();
    menu.style.top  = coordY;
    menu.style.left = coordX;
}

function fadeIn(a) {
    if (a == null) { a = 0; }
    menu.style.filter = "alpha(opacity=" + a + ")";
    if (a < 100) {
        setTimeout("fadeIn(" + (a+10) + ")", 30);
    } else {
        menu.style.filter = "";
    }
}
function ocultar(a) {
    // cria um fade out
    if (a == null) { a = 100; }
    menu.style.filter = "alpha(opacity=" + a + ")";
    if (a > 0) {
        setTimeout("ocultar(" + (a-10) + ")", 20);
    } else {
        menu.style.display = "";
    }
}


document.oncontextmenu = mostrar;
document.onclick = ocultar;

</script>

</head>

<body>

<pre>
  Please note that users of Microsoft Windows XP with <b>Service Pack 2</b> will need to unblock 

this page in order to see the menu.
  The reason for this is due to the fact that the menu has been written in JavaScript.
  This feature is considered unsafe when used locally and Service Pack 2 now blocks this by 

default for your safety.
  This only happens when you run the menu on a local machine, live use on the Internet will not 

be affected. 

  <input type="text" name="teste" onclick="clickMouse(event);" />
</pre>


<div id="menu">
  <a href="javascript:;" onclick="exec('Copy');"  title="Copiar (Ctrl+C)">Copiar</a>
  <a href="javascript:;" onclick="exec('Cut');"   title="Recortar (Ctrl+X)">Recortar</a>
  <a href="javascript:;" onclick="exec2('Paste');" title="Colar (Ctrl+V)">Colar</a>
</div>


</body>
</html>

Link para o comentário
Compartilhar em outros sites
  • 0
rEd nEcK *

rEd nEcK *

Postado
Postado

Illidan, muito estranho, aqui no meu pc funcionou tudo perfeitamente !

ele recorta os textos ate do corpo da pagina !

não sei porque não funciona no pc de voces !

agora para fazer funcionar em todos os navegadores sou afavor e tou aqui para o que eu puder ajudar !

falou

Link para o comentário
Compartilhar em outros sites
  • 0
Kaka

Kaka

Postado
Postado

E ae Fabyo ... deu erro cara ???

Mas você copiou o código que eu postei na minha última mensagem ???

Nela o var obj é declarado fora da função, o que acaba com este erro que você citou e estava ocorrendo comigo também.

Copie e código postado e cole na sua página. Não é possível que dê erro no IE cara, já testei em 6 máquinas diferentes aqui e deu certo.

Abraços.

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,1k
    • Posts
      651,8k
×
×
  • Criar Novo...