Tema: problema al cargar con jquery
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 28/06/2011, 10:10
Pipe2890
 
Fecha de Ingreso: junio-2011
Mensajes: 13
Antigüedad: 13 años, 4 meses
Puntos: 2
problema al cargar con jquery
bueno tengo un problema en Firefox al cargar contenido dinamico, (el contenido es un slide de fotos)

lo que hago es cargar contenido en una div mediante Jquery, funciona perfectamente en chrome pero al usar otro navegador se carga erroniamente,, al ver el contenido html tanto en chrome como en ff, se ve bien (de forma independiente) pero al momento de cargarlo dinamicamente no carga bien pero solo en Firefox por que sera, dejo imagen y codigos,






index.php:

Código HTML: 
Ver original
  1. <script type="text/javascript" src="../librerias/jquery.js"></script>
  2. <link href="estyle.css" rel="stylesheet" type="text/css">
  3.  
  4. <link href="../librerias/themes/default/jquery.lightbox.css" rel="stylesheet" type="text/css">
  5.  
  6. <script type="text/javascript" src="../librerias/lb1.js"></script>  
  7. <style type="text/css">
  8. <!--
  9. .Estilo1 {
  10.     font-family: "Century Gothic";
  11.     color: #000000;
  12.     font-weight: bold;
  13.     font-size: 18px;
  14. }
  15. .Estilo2 {
  16.     font-size: 36px;
  17.     font-family: "Century Gothic";
  18.     font-weight: bold;
  19. }
  20. .Estilo3 {font-size: 36px}
  21. #Layer1 {
  22.     position:absolute;
  23.     width:113px;
  24.     height:129px;
  25.     z-index:1;
  26.     left: 69px;
  27.     top: 74px;
  28. }
  29. #Layer2 {
  30.     position:absolute;
  31.     width:141px;
  32.     height:164px;
  33.     z-index:1;
  34.     left: 72px;
  35.     top: 41px;
  36. }
  37. #Layer3 {
  38.     position:absolute;
  39.     width:168px;
  40.     height:163px;
  41.     z-index:2;
  42.     left: 281px;
  43.     top: 43px;
  44. }
  45. -->
  46. </style>
  47.  
  48.  
  49.  
  50.  
  51. <script type="text/javascript">
  52.    
  53.  
  54.  
  55. var ajaxf = false;
  56.  
  57.  
  58.  
  59. function cargador (envia) {
  60.  if (ajaxf == false) {
  61.    ajaxf = true;
  62.  
  63. $.post ("action.php", {uno:envia}, function(data){
  64. $("#cambia").slideUp(900).fadeTo(900,0).delay(700).slideDown('slow').fadeTo("slow",1);
  65. setTimeout(function(){$("#cambia").html(data);
  66.  ajaxf=false;
  67.  
  68.  
  69. },1000);
  70. });
  71.  
  72.  
  73.  
  74. }
  75.  
  76.  
  77.  
  78. }
  79.  
  80.  
  81.  
  82. </script>
  83.  
  84. <body>
  85. <div class="cuerpo">
  86.  
  87.               <div class="header">
  88.                 <a  href="javascript: cargador ('fotos' )"><div id="Layer2"></div>
  89.                 </a>
  90.                   
  91.                 <a href="javascript: cargador ('videos' )" ><div id="Layer3"></div></a>
  92.                 </a>
  93.               </div>
  94.   
  95.   
  96.   
  97.               <div class="cab"></div>
  98.                  
  99.                        
  100.                     
  101.                   
  102.               <div class="contenido">
  103.                      <div id="cambia" class="contenido2"><br>
  104.                        <br>
  105.                 </div>
  106.              
  107.   </div>
  108.              
  109. <div class="footer2"></div>
  110.  <div class="footer"></div>
  111.              
  112.  
  113. </div>


--------------el contenido html de las fotos ---- es un slide...----


Código HTML: 
Ver original
  1. <link href="../librerias/themes/default/jquery.lightbox.css" rel="stylesheet" type="text/css">
  2.  
  3.   
  4. <script type="text/javascript" src="../librerias/lb1.js"></script>  
  5.  
  6.  
  7. <script type="text/javascript">
  8.     $(document).ready(function(){
  9.       $('.sexy').lightbox();
  10.     });
  11.   </script>
  12.  
  13.  
  14.  
  15.  
  16.     <style>
  17.         .float{
  18.             float:center;
  19.         }
  20.     #Layer1 {
  21.     position:absolute;
  22.     width:41px;
  23.     height:38px;
  24.     z-index:1;
  25.     left: 308px;
  26.     top: 174px;
  27. }
  28.     #Layer2 {
  29.     position:absolute;
  30.     width:41px;
  31.     height:38px;
  32.     z-index:2;
  33.     left: 764px;
  34.     top: 174px;
  35. }
  36.     #Layer3 {
  37.     position:absolute;
  38.     width:35px;
  39.     height:35px;
  40.     z-index:1;
  41.     left: 10px;
  42.     top: 142px;
  43. }
  44.     #Layer4 {
  45.     position:absolute;
  46.     width:35;
  47.     height:35;
  48.     z-index:2;
  49.     left: 461px;
  50.     top: 142px;
  51. }
  52.     </style>
  53.  
  54. <script type="text/javascript" src="js/jquery.slider.js"></script>
  55.     <script type="text/javascript">
  56.     $(document).ready(function(){
  57.         $('#sliderA').slider(468,293);
  58.     });
  59.     </script>
  60.  
  61.         <div align="center" id="sliderA" style="">
  62.           <div align="center" id="prev" ><a href="javascript:"></div>
  63.             <div id="slider" class="float">
  64.                 <div class="sliderContainer">
  65.                     
  66.  <!-- las images de la galeria deben tener estas medidas 410 px X 308 Px -->
  67. <!--foto1-->
  68. <div class="slide"><a  class="sexy"  href="galeria/1.jpg"><img src="galeria/1.jpg"  /></a>
  69.                       
  70.                 <div id="Layer3"><div  id="prev" ><a href="javascript:"><img src="images/fle2.png"></a></div></div>
  71.                       <div id="Layer4"> 
  72.  
  73.            <div align="center" id="next" ><a href="javascript:"><img src="images/fle1.png"></a></div></div>
  74.                     </div>
  75.  <!--foto2-->               
  76. <div class="slide"><a class="sexy" href="galeria/2.jpg"><img src="galeria/2.jpg"/></a></div>
  77.  
  78. <!--foto3-->
  79. <div class="slide"><a class="sexy" href="galeria/3.jpg"><img src="galeria/3.jpg"/></a></div>
  80.  
  81. <!--foto4-->
  82. <div class="slide"><a class="sexy" href="galeria/4.jpg"><img src="galeria/4.jpg" /></a></div>
  83.  
  84. <div class="slide"><a class="sexy"href="galeria/5.jpg"><img src="galeria/5.jpg" /></a></div>
  85.  
  86. <div class="slide"><a class="sexy" href="galeria/6.jpg"><img src="galeria/6.jpg" /></a></div>
  87.  
  88. <div class="slide"><a class="sexy" href="galeria/7.jpg"><img src="galeria/7.jpg" /></a></div>
  89.  
  90. <div class="slide"><a class="sexy" href="galeria/8.jpg"><img src="galeria/8.jpg" /></a></div>
  91.  
  92. <div class="slide"><a class="sexy" href="galeria/9.jpg"><img src="galeria/9.jpg" /></a></div>
  93.  
  94. <div class="slide"><a class="sexy" href="galeria/10.jpg"><img src="galeria/10.jpg" /></a></div>
  95.  
  96. <div class="slide"><a class="sexy" href="galeria/11.jpg"><img src="galeria/11.jpg" /></a></div>
  97.  
  98. <div class="slide"><a class="sexy" href="galeria/12.jpg"><img src="galeria/12.jpg" /></a></div>
  99.  
  100. <div class="slide"><a class="sexy" href="galeria/13.jpg"><img src="galeria/13.jpg" /></a></div>
  101.  
  102.  
  103.  
  104.                 </div>
  105.             </div>
  106.             <div align="center" id="next" ><a href="javascript:"></a></div>
  107.             <div style="clear:both;"></div>
  108.         </div>
Última edición por Pipe2890; 28/06/2011 a las 10:55