No funciona galeria de imagenes

JeMaGa · #1 (**permalink**) 15/04/2013, 14:40

Buenas tardes tengo un script que me crea una galería de imágenes, esta me funciona bien y todo cuanod la ejecuto directamente el archivo donde se encuentra, pero al incluir ese archivo en la pagina donde quiero que se muestre, funciona pero desordena la pagina como ya esta me gustaría saber por que y como lo soluciono

Código PHP:

Ver original<head>
 
    <title>.:LABORATORIOS SFC LTDA:.</title>
    <link rel="shortcut icon" href="imagenes/logito.ico" />
    <link type="text/css" rel="stylesheet" href="main.css"/>
 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" href="css/jMenu.jquery.css" type="text/css" />
        
 
        
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui.js"></script>
        <script type="text/javascript" src="js/jMenu.jquery.js"></script>
 
            
</head>
 
<script type="text/javascript">
$(document).ready(function() {
$("#jMenu").jMenu();
});
 
 
  $(document).ready(function(){ // Script del menú con pestañas
    $('#contenido_pestanas div').css('position', 'absolute').not(':first').hide();
    $('#contenido_pestanas ul li:first a').addClass('aqui');
    $('#contenido_pestanas a').click(function(){
        $('#contenido_pestanas a').removeClass('aqui');
        $(this).addClass('aqui');
        $('#contenido_pestanas div').fadeOut(350).filter(this.hash).fadeIn(350);
        return false;
        
    });
 });
</script> 
 
 
<body>
 
<div id="mostar" align="center" style="background-color:transparent">
 
    <div id="contenido_pestanas" align="center">
    
            <ul id="jMenu">
    
                  <li><a href="#opcion1" title="Opción 1"><img src="imagenes/icono.png" width="23" height="23"><br>INICIO</a></li>
    
    
                  <li><a href="#opcion2" title="Opcion 2"><img src="imagenes/servicios.png" width="23" height="23"><br>SERVICIOS</a></li>
    
    
                <li>
                    <a class="fNiv"><img src="imagenes/producto.png" width="23" height="23"><br>PRODUCTOS</a>
                    <ul>
                        <li class="arrow"></li>
                        <li>
                            <a>Antibioticos</a>
                            <ul>
                                <li><a>Bovinos</a></li>
                                <li><a>Equinos</a></li>
                                <li><a>Porcinos</a></li>
                                <li><a>Ovinos</a></li>
                                <li><a>Caprinos</a></li>
                                <li><a>Gatos</a></li>
                                <li><a>Caninos</a></li>
                                <li><a>Aves</a></li>
                            </ul>
                        </li>
 
  <li><a href="#opcion3" title="Opcion 3"><img src="imagenes/nosotros.png" width="23" height="23"/><br>NOSOTROS</a></li>
                    <li><a href="#opcion4" title="Opcion 4"><img src="imagenes/contacto2.png" width="23" height="23" ><br>CONTACTENOS</a></li>
    
            </ul>
 
              <div id="opcion1">
                    <h3><b>INICIO</b></h3></br>
                        <p>
                         
                        </p>
              </div>
                
               <div id="opcion2">
                  <h3><b>SERVICIOS PRESTADOS</b></h3></br>
                      <p> 
                        estos son los sevicios prestados
                      </p>
               </div>
    </div><!-- Fin contenido_pestanas-->  
    
</div>
 
</body>
</html>

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="coin-slider.js"></script>
    
</head>
 
<body>
 
<div id="games">
        
                <p align="center"><img src="imagenes/contacto2.png" alt="Mini Ninjas" />
                  <span></span>
                  
                  <img src="imagenes/contacto.png" alt="Price of Persia" />
                  
                  <img src="imagenes/icono.png" alt="Spiderman: Shattered Dimensions" />
                  
                  <img src="imagenes/nosotros.png" alt="Brink" />
                  
                  <img src="imagenes/servicios.png" alt="God of War III" />
                  
                  <img src="imagenes/producto.png" alt="Borderlands" /></p>
                <p align="center"><img src="imagenes/" alt="Star Wars: The Old Republic" />
                  
                  
</div>
        <div align="center"> </div>
        <script>
            $('#games').coinslider();
        </script>
</body>
</html>

agradesco toda la ayuda que me puedan brindar!!

C2am · #2 (**permalink**) 15/04/2013, 19:15

Tienes online la web para ver cual es el problema, porque no llego a comprenderte.

Saludos

JeMaGa · #3 (**permalink**) 16/04/2013, 06:20

No, esta local por el momento. pero es que no se, tengo un div que se encarga de las pestañas, contenido y todo. todo este archivo ocmpleto es mi index

Código HTML:

Ver original<head>
 
    <title>.:LABORATORIOS SFC LTDA:.</title>
    <link rel="shortcut icon" href="imagenes/logito.ico" />
    <link type="text/css" rel="stylesheet" href="main.css"/>
 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" href="css/jMenu.jquery.css" type="text/css" />
        
 
        
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui.js"></script>
        <script type="text/javascript" src="js/jMenu.jquery.js"></script>
 
            
</head>
 
<script type="text/javascript">
$(document).ready(function() {
$("#jMenu").jMenu();
});
 
 
  $(document).ready(function(){ // Script del menú con pestañas
    $('#contenido_pestanas div').css('position', 'absolute').not(':first').hide();
    $('#contenido_pestanas ul li:first a').addClass('aqui');
    $('#contenido_pestanas a').click(function(){
        $('#contenido_pestanas a').removeClass('aqui');
        $(this).addClass('aqui');
        $('#contenido_pestanas div').fadeOut(350).filter(this.hash).fadeIn(350);
        return false;
        
    });
 });
</script> 
 
<body>
<div id="mostar" align="center" style="background-color:transparent">
 
    <div id="contenido_pestanas" align="center">
    
            <ul id="jMenu">
    
                  <li><a href="#opcion1" title="Opción 1"><img src="imagenes/icono.png" width="23" height="23"><br>INICIO</a></li>
    
    
                  <li><a href="#opcion2" title="Opcion 2"><img src="imagenes/servicios.png" width="23" height="23"><br>SERVICIOS</a></li>
    
    
                <li>
                    <a class="fNiv"><img src="imagenes/producto.png" width="23" height="23"><br>PRODUCTOS</a>
                    <ul>
                        <li class="arrow"></li>
                        <li>
                            <a>Antibioticos</a>
                            <ul>
                                <li><a>Bovinos</a></li>
                                <li><a>Equinos</a></li>
                                <li><a>Porcinos</a></li>
                                <li><a>Ovinos</a></li>
                                <li><a>Caprinos</a></li>
                                <li><a>Gatos</a></li>
                                <li><a>Caninos</a></li>
                                <li><a>Aves</a></li>
                            </ul>
                        </li>
                        <li><a>Modigold SFC</a></li>
                        <li><a>Ivermectina 3.15% L.A</a></li>
                    </ul>
                </li>
    
                    <li><a href="#opcion3" title="Opcion 3"><img src="imagenes/nosotros.png" width="23" height="23"/><br>NOSOTROS</a></li>
                    <li><a href="#opcion4" title="Opcion 4"><img src="imagenes/contacto2.png" width="23" height="23" ><br>CONTACTENOS</a></li>
    
            </ul>
 
              <div id="opcion1">
                    <h3><b>INICIO</b></h3></br>
                        <p>
                         
                        </p>
              </div>
                
               <div id="opcion2">
                  <h3><b>SERVICIOS PRESTADOS</b></h3></br>
                      <p> 
                        estos son los sevicios prestados
                      </p>
               </div>
                
               
              <div id="opcion3">
                <h3><b>LABORATORIOS SFC LTDA</b> </h3></br>
                    <p>
                      <?php include('nosotros.php');?>
                    </p>
              </div>
                
              <div id="opcion4">
                <b><h3>CONTACTENOS</h3></b></br>
                    <p>&nbsp;
                       <?php include('contacto.php');?>
                    </p>    
              </div> 
              
    </div><!-- Fin contenido_pestanas-->  
    
</div>
 
</body>
</html>

necesito poner en el inicio una galeria de imagenes entonces tengo un aque encontre en internet con jquery, si ejecuto solo el archivo que me contiene la galeria me funciona bien pero cunaod la incluyo en mi index me desorganiza todo.

ya ni funciona el index y la galeria se muestra sin formato.
no se si ahora i me hice entender. esta es mi archivo de galeria

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="coin-slider.js"></script>
    
</head>
 
<body>
 
<div id="games">
        
                <p align="center"><img src="imagenes/contacto2.png" alt="Mini Ninjas" />
                  <span></span>
                  
                  <img src="imagenes/contacto.png" alt="Price of Persia" />
                  
                  <img src="imagenes/icono.png" alt="Spiderman: Shattered Dimensions" />
                  
                  <img src="imagenes/nosotros.png" alt="Brink" />
                  
                  <img src="imagenes/servicios.png" alt="God of War III" />
                  
                  <img src="imagenes/producto.png" alt="Borderlands" /></p>
                <p align="center"><img src="imagenes/" alt="Star Wars: The Old Republic" />
                  
                  
</div>
        <div align="center"> </div>
        <script>
            $('#games').coinslider();
        </script>
</body>
</html>

Agradezco toda la ayuda posible y si no, me podrian colaborar indicandome como puedo sacar la galeria

Gracias :)

C2am · #4 (**permalink**) 16/04/2013, 06:32

¿Y cómo estás metiendo ese archivo en tu index?

pzin · #5 (**permalink**) 16/04/2013, 06:35

¿Y qué hacemos sin ver el CSS? He ahí la razón de porqué C2am, hábilmente, preguntaba por una versión en línea.

JeMaGa · #6 (**permalink**) 16/04/2013, 07:59

Esta parte es del index

Código CSS:

Ver originalhtml, body, div{
    border:0pt none;
    margin:0pt;
    padding:15pt;
 
}
 
body{
    line-height:normal;
    margin: 7pt;
    cursor: default;
    color: #000;
    text-align: center;
    background:url('imagenes/Fondo.PNG');
    background-attachment: fixed;
    background-repeat: no-repeat;
    font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}
 
#contenido_pestanas ul  {   display: block; height: 51px;}
#contenido_pestanas a {   float: center; padding: 4.5px 30px; list-style: none; border: 1px solid #333;   }
#contenido_pestanas a.aqui  {   background-color: #600; color: #fff; box-shadow: 3px 0px 2px #ccc;
                                    -webkit-box-shadow: 3px 0px 2px #600; -moz-box-shadow: 3px 0px 2px #600;}
#contenido_pestanas div  {   border: 1px solid #600; width: 850px; background: #fff; padding: 50px; box-shadow: 3px 3px 2px #600;
                                    -webkit-box-shadow: 3px 3px 2px #ccc; -moz-box-shadow: 3px 3px 2px #600;}

y esta de la galeria

Código CSS:

Ver original.coin-slider { overflow: hidden; zoom: 1;  }
.coin-slider a{ text-decoration: none; outline: none; border: none; }
 
.cs-buttons { font-size: 0px; padding: 10px; float: left; }
.cs-buttons a { float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }
.cs-active { background-color: #B8C4CF; color: #FFFFFF; }
 
.cs-title { width: 545px; padding: 10px; background-color: #000000; color: #FFFFFF; }
 
.cs-prev, 
.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; }

y como son archivos php yo incluyo la galeria en el index asi

include('galeria.php');

C2am · #7 (**permalink**) 16/04/2013, 09:03

Pero no puedes hacer eso, ya que galeria.php no es "una parte" sino "un todo".
Me explico, no puedes hacer esto:

Código HTML:

Ver original<html>
<head></head>
<body>
 
<html>
<head></head>
<body>una web dentro de otra NO</body>
</html>
 
 
</body>
</html>

Cada html debe tener UN SOLO <html>, un solo <head>, y un solo <body>

Lo puedes hacer si metes galeria dentro de un iframe, o frame (cosas del siglo pasado).

Para incluirlo deberas trabajar un poco más.
Incluir las librerias js en el encabezado del index,
Y dejar en galeria.php sólo lo que está dentro de <body></body>

Es decir, para usar include(""); sólo puedes incluir partes de un "html" y no todo el "html".
Piensa en un rompecabezas, cada include es una pieza, no un nuevo rompecabezas.

Saludos

JeMaGa · #8 (**permalink**) 16/04/2013, 09:07

mm ya te entendi entonces que si yo quiero utilizar el include, solo dejo la parte de la galeria, y todo lo demas como esta en el index no ha necesidad de ponerlo en el otro archivo gracias voy a probar :)

JeMaGa · #9 (**permalink**) 16/04/2013, 09:17

listo ahora ya ni me muestra la galeria, antes la mostraba en desorden y sin formato ahora ni la muestra. e hice lo que me indicaste deje solo el div que contiene la galeria y lo inclui en el index y no muestra nada

pzin · #10 (**permalink**) 16/04/2013, 09:21

Supongo que no habrás incluido los archivos javascript desde la página en la que estás incluyendo el archivo si sólo has dejado el div que contiene la galeria.

C2am · #11 (**permalink**) 16/04/2013, 09:28

Cita:

Para incluirlo deberas trabajar un poco más.
Incluir las librerias js en el encabezado del index

Edito: Ah, no te vi pzin

JeMaGa · #12 (**permalink**) 16/04/2013, 09:39

hay si no entendi me perdi que pena