JavaScript - ayuda Menu clic derecho del mouse

   
Vista:

ayuda Menu clic derecho del mouse

Publicado por Carlos (6 intervenciones) el 18/12/2015 05:18:23
Disculpen me pueden decir que esta mal en este código se supone que solo debe de iniciar el menú con el clic derecho pero lo esta haciendo con los dos clic izquierdo y el derecho pero yo lo necesito solo con el clic derecho me pueden ayudar por favor les dejo el código para que lo revises.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<html>
<head>
 
<style>
#rightmenu{display: none;position: absolute;z-index: 999;background: #dedede;
border: 1px solid #ccc;box-shadow: 0 1px 2px #bbb;list-style: none;padding:5px 9px;}
#rightmenu li{padding: 2px 0;border-bottom: 1px solid #f0f0f0;border-top: 1px solid #ccc;}
#rightmenu li.first{border-top: none;}
#rightmenu li.last{border-bottom:none;}
#rightmenu li a{text-shadow:0 0 1px white;color:#333;text-decoration: none;}
#rightmenu li a:hover{color:#888;}
</style>
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 
<script type="text/javascript">
   $(document).ready(function(){
      $(document).bind("contextmenu",function(e){
         if($("#rightmenu").is(":visible")){
            $("#rightmenu").hide().slideToggle("fast").css({
               left:e.pageX,
               top:e.pageY
            });
         }
          else{
            $("#rightmenu").slideToggle("fast").css({
               left:e.pageX,
               top:e.pageY
            });
         }
         return false;
      }).click(function(){
         $("#rightmenu").slideToggle("fast");
      });
   });</script>
 
</head>
<body>
 
<ul id="rightmenu">
  <li class="first"><a href="URL">Asignaciones BTPI</a></li>
  <li><a href="URL">Tabla de Colores</a></li>
  <li class="last"><a href="URL">Visor de Codigo Web</a></li>
</ul>
 
<a href="#">Asignaciones BTPI</a>
 
</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Jordi

ayuda Menu clic derecho del mouse

Publicado por Jordi (75 intervenciones) el 18/12/2015 07:02:04
Hola Carlos,

Lo que estás declarando tú es un evento click sin especificar qué botón se pincha. Lo que tienes que utilizar es un evento mousedown que te diga cuál de esos botones se ha utilizado.

Como puedes ver en este link de StackOverflow, se utiliza de la siguiente forma:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$('#element').mousedown(function(event) {
    switch (event.which) {
        case 1:
            alert('Left Mouse button pressed.');
            break;
        case 2:
            alert('Middle Mouse button pressed.');
            break;
        case 3: // El caso que nos interesa!
            alert('Right Mouse button pressed.');
            break;
        default:
            alert('You have a strange Mouse!');
    }
});

http://stackoverflow.com/questions/1206203/how-to-distinguish-between-left-and-right-mouse-click-with-jquery
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

ayuda Menu clic derecho del mouse

Publicado por Carlos (6 intervenciones) el 18/12/2015 15:51:33
Como lo reparo necesito ese código
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<html>
<head>
 
<style>
#rightmenu{display: none;position: absolute;z-index: 999;background: #dedede;
border: 1px solid #ccc;box-shadow: 0 1px 2px #bbb;list-style: none;padding:5px 9px;}
#rightmenu li{padding: 2px 0;border-bottom: 1px solid #f0f0f0;border-top: 1px solid #ccc;}
#rightmenu li.first{border-top: none;}
#rightmenu li.last{border-bottom:none;}
#rightmenu li a{text-shadow:0 0 1px white;color:#333;text-decoration: none;}
#rightmenu li a:hover{color:#888;}
</style>
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 
<script type="text/javascript">
   $(document).ready(function(){
      $(document).bind("contextmenu",function(e){
         if($("#rightmenu").is(":visible")){
            $("#rightmenu").hide().slideToggle("fast").css({
               left:e.pageX,
               top:e.pageY
            });
         }
          else{
            $("#rightmenu").slideToggle("fast").css({
               left:e.pageX,
               top:e.pageY
            });
         }
         return false;
      }).click(function(){
         $("#rightmenu").slideToggle("fast");
      });
   });</script>
 
</head>
<body>
 
<ul id="rightmenu">
  <li class="first"><a href="URL">Asignaciones BTPI</a></li>
  <li><a href="URL">Tabla de Colores</a></li>
  <li class="last"><a href="URL">Visor de Codigo Web</a></li>
</ul>
 
<a href="#">Asignaciones BTPI</a>
 
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de txema

ayuda Menu clic derecho del mouse

Publicado por txema (25 intervenciones) el 19/12/2015 01:14:15
Hola Carlos:

Cambia tu script por este:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script>
$(document).ready(function() {
    /* mostramos el menú si hacemos click derecho con el ratón */
    $(document).bind("contextmenu", function(e) {
        $("#rightmenu").css({
            'display': 'block',
            'left': e.pageX,
            'top': e.pageY
        });
        return false;
    });
    /* cuando hagamos click, el menú desaparecerá */
    $(document).click(function(e) {
        if (e.button == 0) {
            $("#rightmenu").css("display", "none");
        }
    });
});
</script>

Lo he dejado comentado.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de txema

ayuda Menu clic derecho del mouse

Publicado por txema (25 intervenciones) el 19/12/2015 01:52:39
Una variable más sencilla puede ser ésta:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script>
$(document).click(function(e) {
    /* cuando hagamos click izquierdo, el menú desaparecerá */
    if (e.button == 0) {
        $("#rightmenu").css("display", "none");
    }
    /* si hacemos click derecho mostramos el menú */
    if (e.button == 2) {
        $("#rightmenu").css({
            'display': 'block',
            'left': e.pageX,
            'top': e.pageY
        });
    }
    return false;
});
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar

ayuda Menu clic derecho del mouse

Publicado por Carlos (6 intervenciones) el 25/12/2015 02:28:57
Gracias funciona de maravilla gracias gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar