funcion slidedown de jquery no funciona con joomla 3
Publicado por Andres (1 intervención) el 08/05/2014 04:24:41
buenos dias.
he estado trabajando en un menu deslisable con jquery, el menu me a resultado bien en joomla 2.5, pero cuando intento ponerlo en joomla 3 no me funciona, no me muestra nisiquiera un error solo se queda quieto y no realiza la animacion.
este es mi codigo
esta es la clase
ayuda por favor
he estado trabajando en un menu deslisable con jquery, el menu me a resultado bien en joomla 2.5, pero cuando intento ponerlo en joomla 3 no me funciona, no me muestra nisiquiera un error solo se queda quieto y no realiza la animacion.
este es mi codigo
1
2
3
4
5
6
7
8
9
<script>
$(document).ready(function() {
$('.nav li').hover(function(){
$(this).find('ul').stop(true, true).slideDown('slow');
}, function(){
$(this).find('ul').stop(true, true).slideUp('slow');
});
});
</script>
esta es la clase
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<style>
#mainmenu .nav{
padding: 0;width: 30%;
height: 25px; margin: 0px 20px;text-align: center;
}#mainmenu ul{
margin: 0; padding: 0; position: absolute; float: left;}#mainmenu li{
list-style-type: none;
position: relative; float: left; padding: 0; margin: 0;margin-top: 3px;
display: inline;}#mainmenu .item-102 ul li{
float: left; position: relative; display: inline;}#mainmenu .item-102 ul{
background-color: #03F;
display: none;border: 1px solid #000000;
position: absolute; float: left; width: 171px;}#mainmenu .item-102 ul a{
background-color: #03F;
display: block; margin: 0px 0px;margin-bottom: 3px;
border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius : 0px;
}#mainmenu .item-102 ul a:hover{
background-color: #06F;
}#mainmenu .item-101 a:hover{
background-color: #F00;
text-shadow: 1px 1px #000000;
}#mainmenu .item-102 a:hover{
background-color: #03F;
text-shadow: 1px 1px #000000;
}#mainmenu .item-105 a:hover{
background-color: #060;
text-shadow: 1px 1px #000000;
}#mainmenu a{
padding: 0 15px;font-size: 12pt;
margin-right: 3px;
background-color: #000;
color: #FFF;
text-decoration: none;
font-weight: bold;
-moz-border-radius-topright: 7px;
-moz-border-radius-topleft: 7px;
border-top-right-radius: 7px;
border-top-left-radius: 7px;
-webkit-top-right-radius: 7px;
-webkit-top-left-radius: 7px
}</style>
este es mi menu
<div id="mainmenu">
<div class="moduletable">
<ul class="nav menu">
<li class="item-101 current active"><a href="/" >Inicio</a></li><li class="item-102"><a href="/" >Quienes somos</a><ul class="nav-child"><li class="item-103"><a href="/" >Historia</a></li><li class="item-104"><a href="/" >Mision</a></li></ul></li><li class="item-105"><a href="/" >Contacto</a></li></ul>
</div>
</div>
ayuda por favor
Valora esta pregunta
0