Tema: calendario se corre no se que hacer ya
Ver Mensaje Individual
  #3 (permalink)  
Antiguo 24/08/2011, 08:49
Avatar de angel2010
angel2010
 
Fecha de Ingreso: julio-2010
Ubicación: monagas
Mensajes: 131
Antigüedad: 14 años, 4 meses
Puntos: 2
Respuesta: calendario se corre no se que hacer ya
en morzilla firefox funciona bien pero en internet explorer se corre demaciado da la posicion que deve salir

este es codigo

css calendario
Código CSS: 
Ver original
  1. DIV.calendar
  2. {
  3.     POSITION:absolute;
  4.     top:100%;
  5.     z-index:4;
  6. }
  7. .calendar
  8. {
  9.     BORDER-RIGHT: #0099FF 1px solid;
  10.     BORDER-TOP: #0099FF 1px solid;
  11.     FONT-SIZE: 11px;
  12.     BACKGROUND: #efe;
  13.     BORDER-LEFT: #0099FF 1px solid;
  14.     CURSOR: default;
  15.     COLOR: #000;
  16.     BORDER-BOTTOM: #0099FF 1px solid;
  17.     FONT-FAMILY: tahoma,verdana,sans-serif
  18. }
  19. .calendar TABLE
  20. {
  21.     BORDER-RIGHT: #0099FF 1px solid;
  22.     BORDER-TOP: #0099FF 1px solid;
  23.     FONT-SIZE: 11px;
  24.  BACKGROUND: #efe;
  25.     BORDER-LEFT: #0099FF 1px solid;
  26.     CURSOR: default;
  27.     COLOR: #000;
  28.     BORDER-BOTTOM: #0099FF 1px solid;
  29.     FONT-FAMILY: tahoma,verdana,sans-serif
  30. }
  31. .calendar .button
  32. {
  33.     PADDING-RIGHT: 2px;
  34.     PADDING-LEFT: 2px;
  35.     FONT-SIZE: 90%;
  36.     BACKGROUND: #3580BD;
  37.     PADDING-BOTTOM: 2px;
  38.     COLOR: #fff;
  39.     PADDING-TOP: 2px;
  40.     TEXT-ALIGN: center
  41. }
  42. .calendar .nav
  43. {
  44.     BACKGROUND: url(menuarrow.gif) #438DCB no-repeat 100% 100%
  45. }
  46. .calendar THEAD .title
  47. {
  48.     PADDING-RIGHT: 2px;
  49.     PADDING-LEFT: 2px;
  50.     FONT-WEIGHT: bold;
  51.     BACKGROUND: #00CCFF;
  52.     PADDING-BOTTOM: 2px;
  53.     COLOR: #efa;
  54.     PADDING-TOP: 2px;
  55.     TEXT-ALIGN: center
  56. }
  57. .calendar THEAD .headrow
  58. {
  59. }
  60. .calendar THEAD .name
  61. {
  62.     PADDING-RIGHT: 2px;
  63.     PADDING-LEFT: 2px;
  64.     PADDING-BOTTOM: 2px;
  65.     COLOR: #000;
  66.     PADDING-TOP: 2px;
  67.   BORDER-BOTTOM: #0099FF 1px solid;
  68.     TEXT-ALIGN: center
  69. }
  70. .calendar THEAD .weekend
  71. {
  72.     COLOR: #a66
  73. }
  74. .calendar THEAD .hilite
  75. {
  76.     BORDER-RIGHT: #084 1px solid;
  77.     PADDING-RIGHT: 1px;
  78.     BORDER-TOP: #084 1px solid;
  79.     PADDING-LEFT: 1px;
  80.     PADDING-BOTTOM: 1px;
  81.     BORDER-LEFT: #084 1px solid;
  82.     COLOR: #000;
  83.     PADDING-TOP: 1px;
  84.     BORDER-BOTTOM: #084 1px solid;
  85.     BACKGROUND-COLOR: #66CCFF
  86. }
  87. .calendar THEAD .active
  88. {
  89.     PADDING-RIGHT: 0px;
  90.     PADDING-LEFT: 2px;
  91.     PADDING-BOTTOM: 0px;
  92.     PADDING-TOP: 2px;
  93.     BACKGROUND-COLOR: #7c7
  94. }
  95. .calendar THEAD .daynames
  96. {
  97.     BACKGROUND: #dfb
  98. }
  99. .calendar TBODY .day
  100. {
  101.     PADDING-RIGHT: 4px;
  102.     PADDING-LEFT: 2px;
  103.     PADDING-BOTTOM: 2px;
  104.     WIDTH: 2em;
  105.     COLOR: #0099FF;
  106.     PADDING-TOP: 2px;
  107.     TEXT-ALIGN: right
  108. }
  109. .calendar TBODY .othermonth
  110. {
  111.     FONT-SIZE: 80%;
  112.     COLOR: #bbb
  113. }
  114. .calendar TBODY .oweekend
  115. {
  116.     COLOR: #fbb
  117. }
  118. .calendar TABLE .wn
  119. {
  120.     BORDER-RIGHT: #8a8 1px solid;
  121.     PADDING-RIGHT: 3px;
  122.     PADDING-LEFT: 2px;
  123.     BACKGROUND: #dfb;
  124.     PADDING-BOTTOM: 2px;
  125.     PADDING-TOP: 2px
  126. }
  127. .calendar TBODY .rowhilite TD
  128. {
  129.     BACKGROUND: #dfd
  130. }
  131. .calendar TBODY .rowhilite TD.wn
  132. {
  133.     BACKGROUND: #efe
  134. }
  135. .calendar TBODY TD.hilite
  136. {
  137.     BORDER-RIGHT: #bbb 1px solid;
  138.     PADDING-RIGHT: 3px;
  139.     BORDER-TOP: #bbb 1px solid;
  140.  PADDING-LEFT: 1px;
  141.     BACKGROUND: #efd;
  142.     PADDING-BOTTOM: 1px;
  143.     BORDER-LEFT: #bbb 1px solid;
  144.     PADDING-TOP: 1px;
  145.     BORDER-BOTTOM: #bbb 1px solid
  146. }
  147. .calendar TBODY TD.active
  148. {
  149.     PADDING-RIGHT: 2px;
  150.     PADDING-LEFT: 2px;
  151.     BACKGROUND: #dec;
  152.     PADDING-BOTTOM: 0px;
  153.     PADDING-TOP: 2px
  154. }
  155. .calendar TBODY TD.selected
  156. {
  157.     BORDER-RIGHT: #000 1px solid;
  158.     PADDING-RIGHT: 3px;
  159.     BORDER-TOP: #000 1px solid;
  160.     PADDING-LEFT: 1px;
  161.     FONT-WEIGHT: bold;
  162.     BACKGROUND: #f8fff8;
  163.   PADDING-BOTTOM: 1px;
  164.     BORDER-LEFT: #000 1px solid;
  165.     COLOR: #000;
  166.     PADDING-TOP: 1px;
  167.     BORDER-BOTTOM: #000 1px solid
  168. }
  169. .calendar TBODY TD.weekend
  170. {
  171.     COLOR: #a66
  172. }
  173. .calendar TBODY TD.today
  174. {
  175.     FONT-WEIGHT: bold;
  176.     COLOR: #0a0
  177. }
  178. .calendar TBODY .disabled
  179. {
  180.     COLOR: #999
  181. }
  182. .calendar TBODY .emptycell
  183. {
  184.     VISIBILITY: hidden
  185. }
  186. .calendar TBODY .emptyrow
  187. {
  188.     DISPLAY: none
  189. }
  190. .calendar TFOOT .footrow
  191. {
  192.     BACKGROUND: #0099FF;
  193.     COLOR: #fff;
  194.     TEXT-ALIGN: center
  195. }
  196. .calendar TFOOT .ttip
  197. {
  198.     PADDING-RIGHT: 2px;
  199.     PADDING-LEFT: 2px;
  200.     BACKGROUND: #33CCFF;
  201.     PADDING-BOTTOM: 2px;
  202.     COLOR: #efa;
  203.     PADDING-TOP: 2px
  204. }
  205. .calendar TFOOT .hilite
  206. {
  207.     BORDER-RIGHT: #084 1px solid;
  208.     PADDING-RIGHT: 1px;
  209.     BORDER-TOP: #084 1px solid;
  210.     PADDING-LEFT: 1px;
  211.     BACKGROUND: #afa;
  212.     PADDING-BOTTOM: 1px;
  213.     BORDER-LEFT: #084 1px solid;
  214.     COLOR: #000;
  215.     PADDING-TOP: 1px;
  216.     BORDER-BOTTOM: #084 1px solid
  217. }
  218. .calendar TFOOT .active
  219. {
  220.     PADDING-RIGHT: 0px;
  221.     PADDING-LEFT: 2px;
  222.     BACKGROUND: #7c7;
  223.     PADDING-BOTTOM: 0px;
  224.     PADDING-TOP: 2px
  225. }
  226. .calendar .combo
  227. {
  228.     BORDER-RIGHT: #0099FF 1px solid;
  229.     BORDER-TOP: #0099FF 1px solid;
  230.     DISPLAY: none;
  231.     FONT-SIZE: 90%;
  232.     Z-INDEX: 100;
  233.     BACKGROUND: #efd;
  234.     LEFT: 0px;
  235.     BORDER-LEFT: #0099FF 1px solid;
  236.     WIDTH: 4em;
  237.     CURSOR: default;
  238.     COLOR: #000;
  239.     BORDER-BOTTOM: #0099FF 1px solid;
  240.     POSITION: absolute;
  241.     TOP: 0px
  242. }
  243. .calendar .combo .label
  244. {
  245.     PADDING-RIGHT: 1px;
  246.     PADDING-LEFT: 1px;
  247.     PADDING-BOTTOM: 1px;
  248.     PADDING-TOP: 1px;
  249.     TEXT-ALIGN: center
  250. }
  251. .calendar .combo .label-IEfix
  252. {
  253.     PADDING-RIGHT: 1px;
  254.     PADDING-LEFT: 1px;
  255.     PADDING-BOTTOM: 1px;
  256.     PADDING-TOP: 1px;
  257.     TEXT-ALIGN: center
  258. }
  259. .calendar .combo .label-IEfix
  260. {
  261.     WIDTH: 4em
  262. }
  263. .calendar .combo .hilite
  264. {
  265.     BACKGROUND: #af8
  266. }
  267. .calendar .combo .active
  268. {
  269.     BORDER-TOP: #6a4 1px solid;
  270.     FONT-WEIGHT: bold;
  271.     BACKGROUND: #efe;
  272.     BORDER-BOTTOM: #6a4 1px solid
  273. }
  274. .calendar TD.time
  275. {
  276.     PADDING-RIGHT: 0px;
  277.     BORDER-TOP: #8a8 1px solid;
  278.     PADDING-LEFT: 0px;
  279.     PADDING-BOTTOM: 1px;
  280.     PADDING-TOP: 1px;
  281.     BACKGROUND-COLOR: #dfb;
  282.     TEXT-ALIGN: center
  283. }
  284. .calendar TD.time .hour
  285. {
  286.     BORDER-RIGHT: #898 1px solid;
  287.     PADDING-RIGHT: 3px;
  288.     BORDER-TOP: #898 1px solid;
  289.     PADDING-LEFT: 4px;
  290.     FONT-WEIGHT: bold;
  291.     PADDING-BOTTOM: 0px;
  292.     BORDER-LEFT: #898 1px solid;
  293.     PADDING-TOP: 0px;
  294.     BORDER-BOTTOM: #898 1px solid;
  295.     BACKGROUND-COLOR: #fff
  296. }
  297. .calendar TD.time .minute
  298. {
  299.     BORDER-RIGHT: #898 1px solid;
  300.     PADDING-RIGHT: 3px;
  301.     BORDER-TOP: #898 1px solid;
  302.     PADDING-LEFT: 4px;
  303.     FONT-WEIGHT: bold;
  304.     PADDING-BOTTOM: 0px;
  305.     BORDER-LEFT: #898 1px solid;
  306.     PADDING-TOP: 0px;
  307.     BORDER-BOTTOM: #898 1px solid;
  308.     BACKGROUND-COLOR: #fff;
  309.  
  310. }
  311. .calendar TD.time .ampm
  312. {
  313.     BORDER-RIGHT: #898 1px solid;
  314.     PADDING-RIGHT: 3px;
  315.     BORDER-TOP: #898 1px solid;
  316.     PADDING-LEFT: 4px;
  317.     FONT-WEIGHT: bold;
  318.     PADDING-BOTTOM: 0px;
  319.     BORDER-LEFT: #898 1px solid;
  320.     PADDING-TOP: 0px;
  321.     BORDER-BOTTOM: #898 1px solid;
  322.     BACKGROUND-COLOR: #fff
  323. }
  324. .calendar TD.time .ampm
  325. {
  326.     TEXT-ALIGN: center
  327. }
  328. .calendar TD.time .colon
  329. {
  330.     PADDING-RIGHT: 2px;
  331.     PADDING-LEFT: 3px;
  332.     FONT-WEIGHT: bold;
  333.     PADDING-BOTTOM: 0px;
  334.     PADDING-TOP: 0px
  335. }
  336. .calendar TD.time SPAN.hilite
  337. {
  338.     BORDER-LEFT-COLOR: #000;
  339.     BORDER-BOTTOM-COLOR: #000;
  340.     COLOR: #fff;
  341.     BORDER-TOP-COLOR: #000;
  342.     BACKGROUND-COLOR: #686;
  343.     BORDER-RIGHT-COLOR: #000
  344. }
  345. .calendar TD.time SPAN.active
  346. {
  347.     BORDER-LEFT-COLOR: #f00;
  348.     BORDER-BOTTOM-COLOR: #f00;
  349.     COLOR: #0f0;
  350.     BORDER-TOP-COLOR: #f00;
  351.     BACKGROUND-COLOR: #000;
  352.     BORDER-RIGHT-COLOR: #f00
  353. }


en es el php
Código PHP: 
Ver original
  1. <div class="form">
  2.                     <label class="campo">Fecha</label>
  3.  <input type="text" name="fecha" id="ingreso" value="" />
  4. <img src="img/calendario.png" width="16" height="16" border="0" title="Fecha" id="lanzador">
  5. <!-- script que define y configura el calendario--> 
  6. <script type="text/javascript"> 
  7.    Calendar.setup({ 
  8.     inputField     :    "ingreso",     // id del campo de texto 
  9.      ifFormat     :     "%d-%m-%Y",     // formato de la fecha que se escriba en el campo de texto 
  10.      button     :    "lanzador"     // el id del botón que lanzará el calendario 
  11. }); 
  12. </script>
  13.  
  14.                 </div>

aparte de eso tengo que llamara otras funcione para que pueda funcionar
que son esta


<script type="text/javascript" src="js/calendar.js"></script>
<script type="text/javascript" src="js/calendar-es.js"></script>
<script type="text/javascript" src="js/calendar-setup.js"></script>